zhangdong@tedu.cn
JS 基础语法
1、使用JS
1、浏览器内核
内核主要负责页面的渲染
内核主要由两部分组成
1、内容排版引擎
解析HTML/CSS
2、脚本解释引擎
解释JS
浏览器 内核 排版引擎 解释引擎
IE Trident - Chakra
Firefox Gecko - Monkey系列
Safari Webkit Webcore Nitro
Chrome Webkit Webcore V8
Opera Presto - Carakan
Opera Webkit Webcore V8
(2013~)
2、搭建JS运行环境
1、独立安装的JS解释器
要求：安装NodeJS
开始-> 搜索输入 cmd
操作：向控制台中输出一句话
console.log("你好世界!");
console.log('Hello World');
2、嵌入在浏览器内核中的JS解释器
1、直接在浏览器Console中输入脚本并执行
2、将JS脚本嵌入在HTML页面中执行
1、通过 html 元素事件
onclick 事件 ：在鼠标单击时要执行的操作
<button οnclick="JS脚本"></button>
<div οnclick="JS脚本"></div>
...
<ANY 事件名称="JS脚本"></ANY>
2、在<script>标记中 编写JS脚本
<script>
document.write("<h1>Hello</h1>");
</script>
3、使用外部脚本文件，编写JS脚本
1、创建脚本文件
***.js
编写JS脚本
2、在使用的页面中引入JS文件
<script src="文件URL"></script>
3、JS调试
代码出现问题，结束本块运行，但不会影响后续块
2、语法规范
1、语句-会被JS解释器所执行的代码
由表达式、关键字、运算符组成
严格区分大小写(重要)
每条语句都由 ; 表示结束
中英文符号：
1、, 和 ，
2、. 和 。
3、; 和 ；
4、: 和 ：
5、" 和 “
6、() 和 （）
2、注释
单行注释：只能注释一行内容
语法：//
多行数值：一次性注释多行内容
语法：/* */
3、变量 和 常量
1、变量
1、什么是变量
内存：保存程序运行过程中所需要用到的"数据"
空间：
位 ：bit 8bit = 1byte
字节：byte 1024byte = 1kb
千字节：kb 1024kb = 1mb
兆字节：mb 1024mb = 1gb
G : gb 1024gb = 1tb
T : tb
变量：表示的就是内存中的一段存储空间
生活中：
1、宾馆的房间
2、超市储藏箱
变量值：保存在变量中的数据
变量名：标识数据在内存中的名字
2、变量的声明
到内存中 声明一段空间，并且起个别名再保存数据
语法：
1、声明变量
var 变量名;
2、为变量赋值
变量名=值;
简写：
var 变量名=值;
3、一条语句声明多个变量
var 名1,名2,...,名n;
ex:
var stuName="张三丰",age=18,gender,score;
3、变量名的规范
1、不允许使用JS的关键字或保留关键字
2、允许包含字母、数字、下划线(_)以及$
var stuName;正确
var $stuName;正确
var stu-name;错误，不能出现 -
3、不能以数字开头
var 1name;错误
var name1;正确
4、不能重复
5、尽量见名知意
var a;
var b,c,d,e,f,g;
var studentName;
6、推荐使用 "匈牙利命名法","驼峰命名法","下划线命名法"
驼峰命名法：
1、变量名由一个单词组成，采用全小写
2、变量名由多个单词组成，第一个单词采用全小写，
其余的每个单词首字符变大写
var studentName;
4、变量的使用
1、未经初始化的变量
1、变量声明之后，没有被赋值就直接使用
var stuName;
console.log(stuName);
结果为：undefined
2、变量未被声明过，而直接使用
console.log(stuAge);
2、声明变量不使用var
在JS中，允许声明变量时不使用var关键字
如果省略var关键字，声明的就是"全局变量"
但，并不推荐此写法
stuGender="男";
console.log(stuGender);
3、可以对变量进行存取操作
1、设置变量的值-存值操作(SET操作)
将数据保存在变量中
特点：只要变量出现在赋值符号(=)的左边，一律是存执操作
var stuName="张三丰";
stuName="张无忌";
var newName=stuName;
2、获取变量的值-取值操作(GET操作)
将数据从变量中取出来使用
特点：只要变量"没"出现在赋值符号的左边，一律都是取值操作
var stuAge=18;//存值操作
console.log(stuAge);//在控制台上打印输出stuAge的值
document.write(stuAge);//在页面上打印输出stuAge的值
var newAge = stuAge;
针对newAge 是存值操作
针对stuAge 是取值操作
stuAge = stuAge + 10;
存值 取值
套餐名:香辣鸡腿堡套餐
汉堡：香辣鸡腿堡
配餐：烤翅
饮料：可乐
2、常量
1、变量与常量
变量：是一个可以变化的数据
常量：是一个不能变化的数据
常量的特点：
在程序中，一旦被声明好，在程序运行过程中就不允许被修改
2、语法
const 常量名=值;
注意：
1、声明常量时必须赋值
2、通常，常量名称采用全大写形式(规范)
3、练习
声明一个变量 用来 保存一个圆的 半径值
计算 该圆的周长，并打印输出 2*π*半径
计算 该圆的面积，并打印输出 π*半径*半径
4、数据类型
1、作用
决定了数据在内存中所占的空间大小
2、数据类型分类
1、原始类型(基本类型)
1、number类型
数字类型
可以表示32位的整数，也可以表示64位的浮点数
整数：32位空间(4字节)
浮点数：小数，64位空间(8字节)
整数：
1、保存十进制数字
由0-9共10个数字组成，逢10进1
var age = 35;
2、保存八进制数字
由0-7共8个数字组成，逢8进1
JS中，八进制数字值，由0开始
var num=010;
3、保存十六进制数字
由0-9，A-F 共 16个数字组成，逢16进1
JS中，十六进制数字，由0x开始
var num=0x10;
浮点数：
小数
支持小数点计数法：35.5,76.8,31.00004
支持指数记录法：4.3e2
2、string类型
字符串类型
表示一系列的文本字符
由Unicode字符，数字，标点符号组成的序列
Unicode : 编码方式之一，
可以由一组十六进制的数字(Unicode码)来表示一个字符。
每个字符在计算机内存中，占2个字节
如何查看字符的Unicode码？？？
字符.charCodeAt(); 十进制表示方式
字符.charCodeAt().toString(2); 二进制
字符.charCodeAt().toString(16);十六进制
张：24352(十进制)
张：0101111100100000(二进制)
张：5f20(十六进制)
如何将 Unicode码 转换为字符？？？
使用 \u 将 十六进制的Unicode码转换为字符
var str = "\u5f20";
中文汉字的范围：
从 \u4e00 开始 到 \u9fa5 结束
string在声明的时候需要使用"" 或 '' 引起来
var num1 = 456;//number
var num2 = "456";//string
特殊字符需要转义:
ex：
想在字符串中 打印输出 ""
\n : 换行
\t : 一个制表符
\" : "
\' : '
\\ : \
3、boolean类型
布尔类型
在程序中只表示真 或 假 的状态值(条件中用的多)
该类型 仅有两个值
true ：真
false ：假
在实际运算中true当做1运算，false当做0运算
4、undefined
语义：访问的数据不存在
2、引用类型
js是解释执行
js两大类型：原始类型和引用类型
所有的var 都会提前到当前script中最前端
1、隐式转换：
规律：1、默认一切转数字类型，做算术计算。
boolean类型 true--> 1 false--> 2
2、+法中，只要有一个是字符串，都转为字符串，
+变为字符串拼接
其他类型转字符串，在字符串前后直接加引号
表达式：有数据、变量和运算符组成的公式
*默认，从左到右，两两计算
NaN： 不是一个数字 的 数字
意义 类型
Not a Number
何时遇到：当无法转为数字是，或无法正常计算时
undefine和任何数计算，结果为NaN
特点： 和任何数据做计算，结果永远为NaN
加法技术中，碰上字符串，也会转为NaN
typeof（x）：返回x的数据类型名称：Number string boolean
undefined
2、强制转换：程序员主动调用专门函数完成的转换
1、任意 to String:2种
var str = x.toString();
var str = String(x)---->相当于隐式转换
***String（x）万能
x.toString: null和undefined转不了
何时使用：通常都在js需要时，自动调用
2、***任意 to Number 3种
1、任意 to Number ；var n = Number（x）--> 隐式
何时使用：将非字符串类型转为数字时使用
将纯数字组成的字符串转为数字类型
2、String to Number：
1 to 整数 var n=parseInt（string）
何时使用：将*字符串*转为整数时使用
如果传入的不是字符串，则先隐式转为String
原理： 从头开始读取字符串中的每个字符
跳过开头的空字符
只读取数字字符
只要碰到第一个不是数字的字符，就退出
不认识小数点
Number vs parseInt
Number 只认识纯数字组成的字符串
Number却可转boolean类型
parseInt（str）认识包含非数字字符的字符串开头位置的数字
parseInt转不了boolean
2、String to 浮点数：var n=parseFloat（str）；
何时使用：只要将字符串转为小数时
用法和parseInt用法完全一样
只认第一个碰到的小数点。
3、任意类型 to Boolean ：var bool = Boolean（x）；
"" 0 NaN undefined null --->false
其余都是true；
3、条件运算符(三目运算符)
目：操作数
单目运算符：只有一个操作数，++,--,!
双目运算符：有两个操作数,+,-,*,...
三目运算符：要求有三个操作数
条件运算符：
? :
表达式1 ? 表达式2 : 表达式3;
表达式1 ：是一个条件，结果为boolean类型
如果表达式1的值为true，则执行表达式2
如果表达式1的值为false，则执行表达式3
输入一个考试成绩，如果成绩大于60分，输出及格，否则输出 不及格
练习：输入一个年龄，如果年龄大于等于 18岁，打印输出 "你已成年"，
否则，打印输出，"还未成年"
条件运算符的嵌套：
表达式2, 表达式3的位置处分别可以再嵌套一个条件表达式
ex : 根据成绩 输出成绩 等级
成绩100 输出 A
90 ~ 100 输出 B
80 ~ 90 输出 C
60 ~ 80 输出 D
60以下 输出 E
课堂练习：获取用户输入，保存在变量input中
var input = [window.]prompt("输入提示");
****凡是从页面上进来的，都是字符串***
算数运算符：+ - * / % ++ -- 都带隐式转换
返回值：只能是number，如果运算无效，返回NaN
隐式转换：默认转Number
+法中，碰到字符串，都转字符串，再拼接；
%膜运算（取余数）：m%n：m/n取除不尽的余数部分
何时使用:1、判定能否整除：
比如：判定奇偶数：
m%2等于0，说明m是偶数
m%2不等于0，说明m是奇数
2、限制计算结果，永远小于除数
***递增、递减运算:++ --
n++: n=n+1;讲n中的值加1，后在保存回n中
2种情况：
++n：前++ ，返回*新*值
n++：后++ ，返回*旧*值
++n或n++单独使用，无影响
如果参与其他表达式中，会影响执行结果。
关系运算：
做比较，比大小
返回值：true、false
隐式转换：默认都转为数字再比较
如果两个都是字符串，则按位pk每个字符的unicode
特殊情况：
1、如果无法转为数字，转为NaN
NaN不等于，不大于，不小于任何值，甚至自己
NaN ！=x --->true
isNaN（num）：专门判定一个num数值是否为NaN
如果是NaN，就返回true，否则返回false
何时使用：只要判断一个数字无效，就用isNaN
开发中何时使用，反着用
用isNAN判断一个num是不是数字，或是否能被
隐式转为数字使用
!isNaN（num）：返回ture--->num是数字
返回false---->num不是数字
2、如果两个都是字符串，则按位pk每个字符的unicode号
undefine vs null
undefine：所有变量的默认初始值，自动赋值
null：主动清空一个变量，释放一个变量
typeof的监测结果：
typeof（undefined）--->undefined
typeof（null）--->object
===：全等，首先类型必须相同，其次值相同
全等不带隐式转换
何时使用：要求类型相同，且值相等时。
3、如果参入比较的两个值都是字符串类型
不再转数字，而是pk每个字符的unicode号
总结：凡是条件：一般都是关系运算或是逻辑运算
***逻辑运算：多个条件（关系运算），综合得出最后的结论
只可能返回true/false
隐式转换：默认转换为boolean类型：boolean（x）
何时使用：只要综合多个条件，得出最终结论
如何使用：3种
&&：读作且，程序总称为“逻辑与”
条件1&&条件2：必须条件1和条件2都为true，
结果为true，只要任意一个为false，结果为false
||：读作与，程序总称为“逻辑或”
！：读作与，程序总称为“非”
！条件：颠倒条件的true/false结果
***短路逻辑：逻辑运算中，如果前一个条件已经可以得出结论
则后续所有条件不再执行！
利用短路逻辑筛选按条件执行语句
条件&&操作：如果满足条件，才执行操作
否则，什么也不做
***函数：封装一项任务的步骤清单的代码段，再起一个任务名
函数是一个引用类型的对象
对象：内存中同时存储多个值的空间
何时使用：发现一项任务，被反复调用，要先将任务步骤封装
为一个函数，再反复调用
如果声明函数：
function 函数名([参数变量列表]){
步骤清单代码段
[return返回值]
}
如何调用函数：函数名([参数变量列表])；
强调：1、函数只有被调用时，才会执行！
2、函数可被反复调用！----代码重用
参数变量：专门接受方法执行所必须的数据的变量
何时使用：如果一个函数，必须提供指定数据，才能正常执行时，
需要提供几个数据，就定义几个参数接收
如何定义参数:不需要var，直接在函数名后的括号中定义参数名
每个参数名直接用逗号分隔
何时，如何转入参数值：调用时，按照参数定义的个数和顺序传入
为什么使用参数：参数可以让方法变的更灵活。
***内存中函数生命周期：
1、定义时：将函数封装在一个对象中保存---函数对象
函数名，其实是指向函数对象的一个变量
***定义时，不会读取函数的内容
2、调用时：在执行环境中增加一个档期函数的执行环境对象
才会逐行读取病执行函数的内容
3、调用后：函数的执行环境弹出，活动对象被释放
***作用域：一个变量的可用范围
本质其实是一个存储多个变量的对象
2、1.全局作用域：专门保存全局变量的对象
全局变量：在任何时候，任何位置都可被访问
2.函数作用域：专门保存函数内部的局部变量的对象
------活动对象
局部变量：2类：1、参数变量 2.在函数内声明的
值在函数调用是的函数内部才可以使用
return返回值：函数调用的执行结果
何时使用：只要函数的执行，需要有明确的返回结果时
要看调用者是否需要获得执行结果
如何定义返回值：在函数定义结尾:return返回值
何时如何获得返回值：调用时：
var 变量=函数名(XXX)；
***按值传递：两变量间赋值或想函数中传递参数时
都是将原变量中的值复制一个副本给对方
修改一方，另一方不受影响
function buy(card){
card-=3;
console.log("余额"+card);
}
var card=10;
buy(card);//输出7
console.log("余额"+card);//输出10
***声明提前：在正式执行程序前，都会先预读所有var声明的变量
和function声明的函数，集中到当前作用域的顶部集中声明
***赋值留在原地***
function fun(){
return 1;
}
console.log(fun());//输出2
function fun(){
return 2;
}
console.log(fun());//输出2
var fun=100;
console.log(fun());//报错
定义函数的第二种方法：
var 函数名=functon(参数){函数体;return 返回值};
vs 声明函数
第二种方法，函数定义不会被提前，仅函数名提前
声明函数，整体(函数名+函数定义)提前
问题1：如果一个表达式或函数有结果，就可至今当一个值用
问题2：如果传入参数个数不符，不会报错：
个数超了，多出的没用
个数不够，未接到值的参数变量，默认值undefine
问题3：在函数内，为没用声明过的变量赋值，
变量会被自动创建在全局--->危险
强烈建议：所有变量使用前，必须用var声明。
function max(a,b,c){
var max=a;
b>max && max=b;//利用短路逻辑
c>max && max = c;
return
}
console.log(max(5,4,6));
全局函数
手册中：课程表--JavaScript--javascript对象---js functions
干扰项：BOM，凡是在BOM阶段交的都不是全局函数。
编码解码：
encodeURL：对包含多字节字符的url字符串编码为单字节字符组成
decodeURL：键encodeURL编码后的字符串，解码为原文
为什么：url不允许包含多字节字符：比如汉字
www.baidu.com/s?kw=张东
%E5%BC%AO%E4%B8%9C
问题：url还不允许包含保留的特殊符号。比如：/
解决：encodeURLComponent/decodeURLComponent
eval：专门执行字符串格式的js语句
还可计算字符串格式的表达式的值
除数为0：js中除数可以为0，结果为：infinity
Infinity，可参与关系运算
isFinite（num）：专门判断一个数组是否在有限范围内
*分支结构：
程序3中结构：顺序 分支 循环
顺序：除去声明提前，其余代码默认都从上向下顺序执行
分支：根据不同的条件，执行不同的代码
循环：让程序反正执行一段相同代码
*分支：3种
1、一个条件，一件事。满足条件就做（，不满足就不做）
如果操作简单：利用短路：条件&&（操作1,操作1,...）
如果操作复杂：
2、一个条件，两件事，满足条件做第一季，不满足做另一件
如果操作简单：三目：条件？操作1：操作2；
3、多个条件，多件市，多选一执行，可一件不执行
如果操作简单：三目：条件1？操作1：
条件2？操作2：
.....? ....:
默认操作;//不能省略
第一个汉字的uncode编码为 "\u4e00"
最后一个汉字的UNcode编码为"\u9fa5"
***for**循环
语法：
for(var 循环变量=初始值;循环条件;迭代编号循环变量){
循环体;
}
特殊写法：
1、for中第一部分，可同时声明并初始化多个变量
2、for中的第三部分，可同时执行多个小操作
3、for循环条件可省略，省略后是死循环
比如：for(;;)代替while(true)
***数组：多个变量的集合，起一个统一的名字---用法
连续保存多个数据的引用类型的对象---存储
为什么使用数组：
程序=数据结构+算法
好的数据结构可以极大提高程序的执行效率！
何时使用：程序中都是用数组集中管理多个数据
如果使用：创建 赋值 取值
1、创建：4种
1、创建空数组：var 数组名=[];---js中见到[]，就是数组
2、创建数组同事，初始化数组中的每个元素：
var 数组名=[值1,值2,值3,...]
内存中的数组：引用类型的对象
每个值相当于一个元素
每个元素都有个下标
下标从0开始，每次增1，到个数-1结束
数组对象的个数：arr.length
arr.length用于等于最大一个下标+1；
3、创建空数组：var 数组名=new Array([n])；
new创建一个新对象
Array数字类型
n标识初始元素的格式，省略则创建空数组
4、创建数组同时初始化数组元素：
var 数组名=new Array(值1,值2,值3,...)；
new Array的歧义：new Array(7);
如何使用数组中每个元素：数组名[i]
数组名[i]的用法和普通的变量完全相同！
赋值：数组名[i]=值
取值：任何位置使用数组名[i]，等效于直接使用数组名[i]中的值
数组是引用类型对象：按值传递
原始类型的值，赋值后，相互不影响
引用类型的对象，赋值后，依然引用同一个对象
任何修改，都会影响对方
null：主动释放一个对象
垃圾回收器：专门释放内存中不再被引用的对象的小程序
伴随主程序执行
什么是: js引擎会自动释放不再被任何变量引用的存储空间
每个对象都有一个引用计数器，增加引用+1，减少引用-1
一个对象，应用计数器为0，不在被任何变量引用，被回收
建议：使用完较大的对象后，都要主动释放
数组的length熟悉固定套路：2个
1、获得最后一个元素值:arr[arr.length-1]
2、想数组未尾追加一个新元素：arr[arr.length]=新值;
遍历数组：依次对数组中每个元素执行相同操作
//三要素
1、条件：小标i<数组长度
2、变量：下标i从0开始，每次++
for(var i=0;i<arr.length;i++){
当前元素：arr[i]
}
chrome中的console.log有时是异步执行，伴随住程序同时执行
关联数组:
什么是关联数组: 可自定义下标名称的数组
vs索引数组: 下标都是数字的数组
为什么: 索引数组中的下标都是无意义的数字,不便于查找
何时: 只要希望在数组中按照意义快速定位一个元素时
如何:
创建: 2步:
1. 创建空数组: var ym=[];
2. 向空数组中添加新元素，使用自定义的下标名称
ym["name"]="杨幂";
ym["math"]=81;
ym["chs"]=53;
ym["eng"]=89;
访问: ym["下标名"]——用法同普通变量
强调：key必须是字符串
特点: ***length属性失效，永远为0***
如果遍历hash数组:
for( var key in ym){
//in依次取出ym数组中的下标名保存到key中
//key仅获得下标名
//ym[key]获得当前元素的值。
//强调: key不加""，因为key是变量，不断变化
}
关联数组中的key不能重复
所以数组如果访问不存在的下标位置，不会保存
会返回undefined9
原理:
索引数组的问题: 查找只能靠遍历
结果: 查找速度受存储位置和元素总数的影响极大
关联数组解决:
hash算法:
根据一个字符串，计算出一个尽量不重复的序号
添加元素:
将自定义的下标名交给hash算法计算出不重复的序号，
将元素保存到序号位置
取值时:
将自定义的下标名较为hash算法，计算出和存入时相同
的序号，直接去序号位置获取元素值
优点:
无需遍历, 查找速度和存储位置以及元素总数无关
今后:只要遍历索引数组，选普通for循环
只要遍历关联数组，值能用for in 循环
indexOf 接收一个数组和一个值，
返回值在数组中的下标位置i
只找第一个，然后就退出
如果没找到，就返回-1
2、数组API：浏览器场所已经实现的方法
开发人员直接调用，不需要了解具体实现。
将数组转为字符串：2个
var str =arr.toString()；返回数组中元素的内容，用逗号分隔
var str = arr.join("连接符");***可自定义连接符***
固定套路：
1、无缝拼接数组每个元素：var str = arr.join("")
如果不加""，等效于toString,用逗号
var chars=["h","e","l","l","o"];
var word = chars.join("");
console.log(word);//hello
2、将单词拼接为句子：var str = arr.join(" ")
var words =["no","zuo","no","die","!"];
var stmt = words.join(" ");
console.log(stmt);//no zuo no die !
3、将数组拼接为html元素
var provs = ["北京市","天津市","河北省","河南省"];
var html = "<select><option>" +
provs.join("</option><option>")
+"</option></select>";
document.write(html);//输入在页面上为下拉列表
优化：数组的拼接比字符串拼接效率更高
建议：今后凡是频繁的字符串拼接，都要2步：
1、先将要拼接的子字符串放入一个数组中用
2、利用数组的join方法，一次性生成结果字符串
拼接数组：var newArr = arr1.concat(arr2,值1,值2)
强调：concat不能修改原数组，总是返回一个新数组
获取子数组：var subArr = arr.slice(stati,endi+1)
starti:开始获取下标位置
endi：表示获取到的下标位置
***含头不含尾**
slice方法支持倒数参数：其实负数下标不存在
假定的负数下标从-1开始
splice:删除 插入 替换
1、删除：arr.splice(starti,n)
从starti位置开始，删除n个元素
2、插入：arr。splice(starti,0,新值1,新值2,....)
在starti位置插入新值1，新值2...
原starti位置及其之后的元素，被向后顺移
3、替换：arr.splice(starti,n,新值1,新值2,...)
新元素的个数和n不一定相等
数组会自动调整元素的位置和长度
颠倒数组中所以元素的位置：arr.reverse();
数组的sort方法：arr.sort();
特点：默认按升序排列
默认一切都转为字符串，再按字符串比大小
自定义排序规则：2步
1、定义比较器函数：专门比较任意两数大小的函数
规定：两个参数(a,b)
必须返回数组：如果a>b,就要返回正数
如果a<b,就要返回负数
如果a=b,就要返回0
2、将比较器函数做完参数传入sort方法中
arr.sort(比较器函数名);//函数名不加圆括号
函数 vs 方法：
都是function
不属于任何对象的叫函数（不需要通过.访问）
属于特定对象的函数叫方法（需要通过对象.才可访问）
***函数也是引用类型的对象
***给升序改降序，只要给比较器的逻辑*-1；
数组API
*栈和队列：其实都是数字，只不过使用了不同的方法
栈：一端封闭，只能从另一端进出的*数组*
何时使用栈：只能从数组一端进出
LIFO
结尾出入栈：
入栈：arr.push(新值);==》arr[arr.length]=新值
出栈：var last = arr.pop();
开头出入栈：
入栈：arr.unshift(新值)；
出栈：var first = arr.shift();
每次出入栈都会影响所有剩余元素的位置发生顺移---低
队列：只能从一端进入，必须从另一端出
何时使用：只要先到的先得
2****二维数组：数组的元素又引用了另一个子数组
何时使用：保存横行竖列的二维数据
保存上下级关系的数据
如何创建：2步
1、创建一个空数组：var data =[]
2、设置数组中每个元素再引用另一个小数组
data[0] = [0,0,0,0];
访问二维数组中任意位置的元素：data[r][c]
二维数组行下标r不能越界，越界就报错
遍历二维数组：固定套路
外层循环遍历行，内层循环遍历当前行的中的列
for(var r =0;r<data.length;r++){
for(var c=0;c<data[r].length;c++){
当前元素：data[r][c]
}
}
***字符串对象：对个字符组成的只能*数组*
和数组相同的API
访问字符串中任意一个字符：str[i]
字符串的长度：str.length
凡是不直接修改原数组的API，字符串都能用
比如：var substr = str.slice(starti,endi+1)
var newstr = str.concat(otherstr);
不能用：reverse() push() str[i]=‘字符’
笔试题:
内置对象：11个
ES标准已经规定好，有浏览器厂商已经实现的对象
开发人员直接使用，不必关系具体实现
String Number Boolean ----包装类型
Array Date RegExp Math
Error
Function Object
Global----->window
***包装类型： 专门封装原始类型的数据，
并提供对原始类型数据操作方法的对象
何时使用： 试图用原始类型的值调用方法时自动创建
用完自动释放
具体创建何种包装类型，要看值的类型
为什么有包装类型：原始类型的值没有任何方法
new String(xxx) vs String(xxx)
String(xxx):隐式类型转换为字符串，返回原始类型的字符串值
new String(xxx)：创建一个String包装类型的对象
返回String包装类型的对象
转义字符：如果字符串内包含与预防冲突的特殊符号
可用转义字符将特殊符号标记为普通字符
比如："-->\" '-->\'
String API:所有API都无法修改原字符串，必定返回新字符串
1、大小写转换
var newStr = str.toLowerCase();//全部转小写
var newStr = str.toUpperCase();//全部转大写
何时使用：只要不区分大小写
2、获取指定位置的字符或unicode
var char =str[i]
str.charAt(i);
var unicode = str.charCodeAt(i);
3、查找关键字的位置：2个API,返回的都是关键字的位置下标
找下一个匹配的关键字位置：var i = str.indexOf("kword",starti)
如果省略starti,从0开始
找前一个匹配的关键字位置：
var i = str.lastIndexOf("kword",starti)
如果省略starti，从最后一位开始
strarti：开始查找的位置
如果没找到，都返回-1；
获取指定位置的字符:
str.charAt(i) => str[i]
获取指定位置的字符的unicode号
str.charCodeAt(i) 获得str中i位置的字符的unicode号
将unicode号反向转为正文:
String.fromCharCode(unicode);
获取子字符串:
str.substring(starti,endi+1) =>str.slice(starti,endi+1)
强调: substring不支持负数参数！
解决: length-n 表示倒数第n个
str.substr(starti,n) 获取str中starti开始的n个字符
相当于: str.substring(starti,starti+n)
强调: 不考虑含头不含尾
****正则表达式:
什么是: 规定一个字符串中字符出现规律的表达式
何时: 2种:
1. 按照规则模糊匹配多种关键词
2. 按照规则验证字符串格式时
如何:
1. 关键词的原文就是最简单的正则表达式
2. 字符集:
什么是: 规定一位字符可选字符列表的集合
何时: 如果一位字符，有多种备选字时
如何: [备选字符列表]
强调: 一个字符集只能匹配1位
简写: 如果备选字符列表中字符是连续的，可用-省略中间的字符
比如:1位数字: [0-9]
1位小写字母: [a-z]
1位大写字母: [A-Z]
1位字母:[A-Za-z]
1 位汉字: [\u4e00-\u9fa5]
特殊: 除了XXX [^字符列表]
3. 预定义字符集:
什么是: 对常用字符集的简化写法
包括: 一位数字: \d [0-9]
一位字母,数字或下划线: \w [0-9A-Za-z_]
一位空字符: \s 空格，制表符等空字符
通配符: . 任意字符
强调: 只有在规则完全匹配时才能使用预定义字符集
问题: 无法匹配字符出现的个数
解决: 量词
4. 量词:
什么是: 规定一位字符集出现次数的规则
何时: 只要规定一位字符集出现的次数
如何:
强调: 总是跟在字符集之后
1. 有明确范围的:
6~8位 {6,8}
6位以上 {6,}
必须6位 {6}
2. 没有明确范围:
? 可有可无，最多一个
* 可有可无，多了不限
+ 最少一个，多了不限
5. 选择和分组:
选择：或|
分组：()
6. 指定匹配位置:
^ 匹配字符串开头
$ 匹配字符串结尾
比如: 仅匹配开头的空字符: ^\s+
仅匹配结尾的空字符: \s+$
同时匹配开头或结尾的空字符: ^\s+|\s+$
\b 匹配单词边界: 开头 结尾 标点 空字符
7.转义：\
8.预判：在正式匹配前，先大概预判整个字符串的规则
多用于排除法
比如：密码强度：6-8位字母、数字或下划线字符
必须包含一个大写和一个数字
所有字符：4大类：数字，小写字母，大写字母，特殊符号
1、排除：不全由数字和小写字母组成
(?![0-9a-z]+$)
2、排除：不全由大写字母和小写字母组成
(?![a-zA-Z]+$)
3、只能有字母或数字、_组成----
\w{6,8}
最终： (?![0-9a-z]+$)(?![a-zA-Z]+$)\w{6,8}
使用正则判断是否包含符合规则的关键词:
var i=str.search(/正则/i)
在str中查找符合正则要求的关键词，返回其位置
如果找不到，返回-1
问题1: 所有正则，默认都区分大小写
解决: 加后缀i 表示忽略大小写
问题: 1. 只能获得位置，无法获得内容
2. 只能找第一个。
解决: match方法
3. 查找所有关键词的内容
var kwords=str.match(/正则/ig)
查找str中所有符合正则要求的关键词，保存在结果数组kwords中
***如果找不到，返回null!
强调: 只要API的返回可能是null，就必须先验证不是null，再使用！
问题: 所有正则，默认仅匹配第一个关键词
解决: 加后缀g 表示查找全部
问题: 只能返回所有关键词的内容，无法返回每个关键词的位置。
4. 即查找每个关键词的内容，又查找每个关键词的位置 ?
替换: 将字符串中找到的敏感词替换为新内容
简单: 将所有敏感词替换为一个统一的新值
str=str.replace(/正则/ig,"新值");
高级: 根据不同的敏感词，动态选择要替换的新值
str=str.replace(/正则/ig,function(kword){
return 根据kword动态选择不同的替换值返回
})
其中: replace会在每个找到的关键词上执行function
每次执行，都会将本次找到的敏感词自动赋值给kword参数变量。
替换或删除子字符串:
var nweStr = str.replace(reg,"替换字符");
格式化字符串：
正则表达式中的每个()，都是一个字表达式
每个字表达式都会自动获得一个从1开始的编号
替换时，可用$n,指代本次匹配中第n个子表达式的对应内容
分隔字符串：
var subs=str.split(reg,[count]);
reg:正则表达式
[count]可有可无，从0开始，代表切割的第几个
例如：var mail=zhangdong@dane.com;
var arr = mail.split(/@/);
console.log(arr[0])输出zhangdong
String API:
获取子字符串：3种
var sub = str.slice(starti,endi+1)
str.substring(starti,endi+1)//不支持负数参数
str.substr(starti,n);//获取多少个
查找：4种
1、查找固定关键字，仅返回位置，可指定开始位置
var i =str.indexOf("kword"[,starti]);
str.lastIndexOf("kword"[,starti]);
何时使用：关键字确定
通过循环，反复获得每个关键字的位置
2、只判断有没有：var i=str.search(reg);
返回值:找到返回i,没找到返回-1；
3、获取所以关键字的内容：var kwords=str.match(reg);
g
返回值：找到返回所以关键字内容的数组
没找到返回null，必须先判断不是null，再使用
4、即获得每个关键字的内容，又获得每个关键字的位置：
var arr = reg.exec(str);
特点：1、每次只返回一个关键字的内容，存在arr的[0]
如果找不到了，返回null
2、将本次找到的关键字的位置保存在arr.index
3、自动调整reg.lastIndex属性为下次开始的位置
课堂练习：网络爬虫
正则：<a[^>]*href=['"][^'"]*['"][^>]*>.*</a>
默认贪婪模式：尽量匹配最差的符合条件的子内容
懒惰模式：只匹配最短的符合条件的子内容
贪婪改懒惰：.*----> (.*?)
RegExp.$n:获得本次匹配中第n个子表达式匹配的内容
替换：str=str.replace(reg."替换值");
如果reg中没有g，只替换第一个匹配的
验证：
var bool = reg.test(str);
如果str符合reg的要求，返回true，说明验证通过
否则返回false，说明验证未通过
***强调
凡是验证，前加^后加$;
如果不加，只要局部匹配，就通过
Math：封装了数学计算的常量值和方法
***不能实例化对象
实例化：用new创建一个指定类型的具体对象---实例
instance
Math常用API
取整：3种
上取整 下取整 四舍五入取整
Math.cei(n) Math.floor(n) Math.round(n)
n.toFixed(d) VS Math.round(n)
n.toFixed(d):指定d位小数四舍五入，*返回字符串*
Math.round(n)：不能指定小数位数，只能取整
*返回number*
乘法和开平方
乘法：Math.pow(底数，幂)
开平方：Math.sqrt(n);
最大值和最小值
var max = Math.max(值1，值2,...);
//默认不支持数组；
固定套路：获取数组中的最大值和最小值：
var max =Math.max.apply(Math,[值1，值2,...])
随机数：Math.random() 0<=r<1;
公式：min -max取随机整数
Math.floor(Math.random()*(max-min+1)+min)
Date:封装了1970年1月1日0点至今的毫秒数
创建：4种
1、创建日期对象，同时获得客户端*当前时间*
var now = new Date();
2、自定义任意时间点
var date = new Date("xxxx/xx/xx[xx:xx:xx]");
3、自定义任意时间点
var date = new Date(xxxx,xx,xx[,xx,xx,xx]");
月，都要-1修正。
4、复制一个日期对象：
何时使用：日期API都至今修改原日期对象
如果希望留住旧日期对象，就需要先复制，再修改副本
如果复制：var old= new Date("XXX");
var target=new Date(old.getTime());
其中：old.getTime()返回旧时间中的毫秒数
Date对象API：
分量： 年 月 日 星期
FullYear Month Date Day
时 分 秒 毫秒
Hours Minutes Seconds Milliseconds
1、每个分量都有一对儿get/set方法
getXXX获得分量的值
setXXX(n)设置分量的值，Day没有set
2、命名：年月日星期，没有s结尾
时分秒毫秒，都有s结尾
3、返回值：除Date外，其余都是从0开始，进制-1结束
强调：只有month需要修正，其余都正常
4、日期转字符串：
var str= date.toLocaleString();//日期+时间
var str = date.toLocaleDateString()//日期
var str = date.toLocaleTimeString()//时间
Date的计算：2种
1、两日期对象可相减，结果是毫秒差
2、对日期任意分量做加减：3步，取分量，做加减，set回去
set方法自动调整进制
固定套路：date.setXXX(date.getXXX()+/-n);
错误处理：即使程序出错，也要保证程序不退出的机制
Error对象：在错误发生时，自动创建的封装错误信息的对象
属性：err.name:错误类型：6种
SyntaxError：语法错误
ReferenceError：引用错误，找不到对象或变量时；
TypeError:类型错误，错误的使用了对象的"方法"
RangeError:范围错误，参数超范围
EvalError：Eval错误，错误的使用了eval函数
URlError：URL错误
如何错误处理：
语法：try{
可能出错的语句；
}cathc(err){
一旦出错，执行的错误处理代码；
}[finally{
无论是否出错，都要执行的代码
}]
建议：能用if屏蔽的问题，优先选择if
大多说try catch都可提前预防
笔试题：js中如何解决浏览器兼容性问题：3种
1、不兼容的类型或方法：2种
if else
try catch
2、不兼容的值，短路逻辑中的||
值1||值2
***错误处理中的return
1、finally中的return，会替换try catch中的return
2、即使finally中没有return，finally中的代码一定会再return钱
执行，但无法影响已确定的return结果
*****函数对象
执行环境栈：ESC，保存全局已经每个函数的执行环境的栈结构
执行环境：EC，调用函数是，创建的引用函数资源的对象
窗口一打开，默认ESC中压入一个全局EC
全局EC引用了window对象VO
window对象中的变量都是全局变量
变量对象VO，专门存储变量的对象
函数声明周期
定义时：仅创建一个函数对象，封装了函数的定义
不会读取函数的内容
调用时：创建函数的EC对象压入ESC中
函数的EC对象引用了，当前函数的活动对象的AO
活动对象：AO：专门保存本次函数调用是的局部变量
AO中有一个属性始终指向window对象
变量使用规则：优先在AO中找
找不到，才去window对象找
调用后：函数的EC对象出栈，AO对象失去引用，被回收
AO对象中的局部变量一起被释放
***重载：overload
相同名称，不同参数列表的多个函数
在调用是，可根据传入参数的不同，动态选择对应的函数执行
js语法默认不支持重载，但可用arguments对象模拟重载的效果
arguments对象：调用时，自动创建并接收所有传入的参数值
类(like)数组(的)对象
2点：1、arguments[i];
2、arguments.length;
何时使用：今后只要多个操作，共用同一个函数名时，
***类数组对象 VS 数组对象：
类型不同：类数组对象的父类型是Object
数组对象的父类型是Array
导致类数组对象无法使用数组类型的方法
类数组对象转为数组对象 固定套路：
var arr = Array.prototype.slice.apply(arguments);
call
总结：今后大部分方法依然要定义参数
只有不确定传入参数的个数时，才省略参数，用arguments
****匿名函数：定义时，不用任何变量引用的函数，
何时使用：2种情况：
1、如果一个函数只执行一次----匿名函数自调
2、如果一个函数作为对象教给其他函数使用时---回调
创建一个比较器函数：3种
1、声明方式定义函数：funciton compare(a,b){return a-b}
只有声明方式定义的函数才能被声明提前
***以下两种方式定义的函数，不能被提前
2、函数直接量方式定义
var compare = funciton(a,b){return a -b}
3、使用new关键字：
var compare = new Function("a","b","return a -b")
//括号中的引号必须要加
匿名函数的优点：节约内存空间
调用前和调用后，内存中不创建任何函数对象
总结：arr.sort(function(a,b)(return a-b));
****作用域与作用链
作用域：一个变量的可用范围，其实就是变量的实际存储位置
只可能是window中或AO中
window：全局作用域--全局变量
AO：函数作用域---局部变量
本质：EC对象的一个scope属性
引用了window或AO对象
作用域链：以当前EC的scope属性为气垫一次引用每个AO，直到
window结束，形成的多级引用关系
只要在作用域链上存在的变量，当前函数都可使用
*****闭包：
问题：全局变量 VS 局部变量
全局变量：优：反复使用，且共享使用
缺：可能随时在任意位置被篡改---全局污染
建议：尽量避免使用全局变量
局部变量：不可反复使用！方法调用完自动释放
解决：闭包：反复使用一个局部变量，且不会被污染
何时使用：想反复使用一个局部变量，且不希望被污染时，
就要用闭包结构包含局部变量
如何使用：1、定义外层函数(工厂函数)
特点：2个
1、定义了受保存都局部变量
2、返回一个专门操作局部变量的内部函数对象
2、调用外层函数（工厂函数），获得返回的内部函数对象
3、使用获得的内部函数对象，操作受保护的局部变量---唯一途径
缺点：比普通函数占用更多的内存空间（外层函数的AO）
判断闭包输出结果：
1、找受保护的局部变量
2、外层函数被调用几次，就创建了几个受保护的变量副本
3、同一次外层函数调用返回的内层函数，永远使用统一个变量
*****面向对象：
对象：程序中描述现实中一个具体属性的方法的结构
内存中保存多个属性和方法的一块存储空间
面向对象：OOP程序中，描述一个具体事务都要用对象来封装事物
的属性和功能
写任何程序，都要先找对象
再识别对象的属性和功能
封装：将描述一个事务的属性和方法集中定义在一个对象中
2、创建对象：3种
1、仅创建一个对象：2种
1、var obj={"属性名":值,"属性名":值,....};
对象 vs 关联数组
***js中一切对象底层都是关联数组；
每个属性可用["属性名"]访问
遍历一个对象中所有属性，也用for in
也可以在任何时候动态添加新属性
强行访问没有的属性返回undefined
方法其实就是属性引用了一个函数对象而已
2、 var obj=new Object();//创建一个空对象
约等于{}；
obj.属性名=值 <==> obj["属性名"]=值；
......
******this关键字：存在EC中，保存正在调用当前方法的对象
默认this--->window
对象中的方法，要使用对象内部的属性是，必须用this引用
不用this：默认在作用域链（AO和window）中找
加this:在this应用的当前对象中找
*****this和定义在哪儿无关
只和调用时使用的对象有关
没有用任何对象，就直接调用的函数，this默认值window
2、反复创建多个相同结构的对象时,2步
1、创建构造函数：规定一类对象，统一属性的函数
function 类型名(属性参数列表){
this.属性名=参数值；
this.属性名=参数值;
... ...
this.方法名=function(){
}...
}
2、用new调用构造函数，装饰一个新创建的对象
var obj=new 类型名(属性值，...);
new：1、先创建空对象，相当于{}；
2、用空对象调用构造函数，this-->正在创建的空对象
按照构造函数的定义，为空对象添加属性和方法
3、将新创建对象的_proto_属性指向构造函数的
Prototype对象
4、将空对象的地址，保存到等号左边的变量中
***原型和原型链
原型：prototype 保存所有子对象共有属性值的父对象
每个(构造)函数都自带一个prototype对象
所有被构造函数创建的字对象都有一个_proto_属性
指向构造函数的prototype对象
什么东西放在构造函数的prototype中？
所有子对象共用的属性值和方法---只在读取时共享
特殊情况：修改prototype中共有属性，必须只能用prototype对象
不能用子对象
如果用子对象修改共有属性，会在子对象创建创建共有属性副本
原型链：由各级子对象的_proto_属性连续引用形成的结构
所有对象都有_proto_
所有对象原型链的顶部都是Object.prototype
.运算符:访问一个对象的属性，只要在原型链上有的，
都可以访问
重写：如果字对象觉得父对象的方法不好用，可在子对象定义同名
方法，就会覆盖父对象中的同名方法
原型相关API
1、判断对象的属性是自有，还是共有
自有属性：在当前对象本地保存的属性
共有属性：从原型链中继承来的属性
如何判断自有：obj.hasOwnProperty("属性名")
如果返回false，不一定说明共有，也可能没有！
如何判断在原型链上有没有：2种
1、"属性名" in 对象
2、if(obj["属性名"])如果有效
可能被干扰：如果属性值刚好为0，NaN,null,""
如何判断共有：固定套路
if(obj.hasOwnProperty("属性名")){
console.log("是自有属性")
}else if("属性名" in obj){
console.log("是共有属性")
}else{
console.log("没有属性")
}
2、获得任意子对象的原型(父对象)：
obj._proto_
var prototype=Object.getPrototypeOf(子对象)；
何时使用：无法获得构造函数时，又希望设置子对象的公有
属性
3、判断父对象是否在子对象的原型链上
上级对象.isPrototypeOf(子对象)
强调：isPrototypeOf不仅找直接父级，而是找整个原型链
*****/*笔试题*/
如果判断一个对象是数组类型：typeof失效
1、if(Array.prototype.isPrototypeOf(obj)){
obj是数组类型
}
2、其实构造函数的prototype指向原型对象
同时，原型对象有constructor指向构造函数对象
if(obj.constructor==Array){
obj是数组类型
}
3、判断子对象是否是指定构造函数的实例instanceof
if(子对象 instanceof 构造函数名){}
instanceof也是查找挣够原型链
4、if(Object.getPrototypeOf(obj)==Array.prototype){}
5、call和apply
call和apply:在调用方法时，修改EC中的this
Object.prototype.toString.call(arr)=="[object Array]"
执行的一刹那，相当于arr.toString();
apply(arr)
call VS apply：
1、都是，在调用方法时，修改当前调用方法的对象
差别：传入参数的形式：
xxx.call(obj,值1,值2,值3...)
xxx.apply(obj,[值1,值2,值3...]);
6、ES5中新函数：Array.isArray(obj)
继承：父对象中的属性和方法，子对象可直接使用
为什么继承：代码重用！节约内存空间！便于维护
js中的继承都是用_proto_
1、直接继承对象：修改对象的_proto_
3种：
1、仅修改一个对象的_proto_
Object.setPrototypeOf(子对象,父对象)
2、通过修改构造函数的原型对象，实现批量修改后续子对象
的继承关系
构造函数.prototype=父对象
强调：仅影响之后创建的对象的继承关系
之前创建的对象依然继承旧构造函数.prototype
3、Object.create(父对象[,{属性列表}])
创建一个空对象
继承父对象中的属性
继承同时可再扩展属性和方法
2、仅继承机构：模拟java中的继承。
function 父类型构造函数(属性参数1，属性参数2){
this.属性1=属性参数1;
this.属性2=属性参数2;
}
function 子类型构造函数(属性参数1，属性参数2，属性参数3){
父类型构造函数.call(this,属性参数1,属性参数2)
this.属性3=属性参数3；
}
var obj=new 子类型构造函数(值1，值2，值3)
总结：面向对象：封装 继承 多态(重载和重写)
多态：同一个东西在不同情况下，表现不同的状态本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
