---------走过夏天，一路慢行的JavaScript之旅（add）！！！
Posted 大王来巡山
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了---------走过夏天，一路慢行的JavaScript之旅（add）！！！相关的知识，希望对你有一定的参考价值。
一、javascript
JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在html（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。
二、JavaScript基本使用方式和常用属性
一、使用JS的三种方式：
1、在HTML中直接内嵌JS（并不提倡使用）；
<button onclick="alert(啦啦啦)">有本事你点我呀！！！</button>
>>>不符合W3C关于内容与行为分离的要求！！！
2、在HTML页面中，使用script标签包裹JS代码；
<script type="text/javascript"></script>
>>><Script></Script>标签可以放到页面的任意位置。
3、引入一个外部单独的JS文件
<script language="JavaScript" src="js/01.js"></script>
[注意事项]
①<script></script>可以嵌入到页面的任意位置。但是，位置的不同会导致JS代码的执行顺序不同；
比如：<script>
</script>放到<body>前面，则代码会在页面加载之前就执行；
②引入一个外部的JS代码，<script></script>必须是成对出现的标签，而且标签中不得出现任何的JS代码；
二、JS中的变量和运算符：
1、JS中变量声明的写法：
var num =10；// 使用var声明的变量，属于局部变量，只是当前作用域内有效；
num = 10； // 不用var声明，默认为全局变量，在整个JS文件中都有效；
var x=8,y,z=10;使用一行语句，同时声明多个变量。上式中，y属于已声明，但是未赋值状态，结果为undefined；
[声明
变量的注意事项]
①JS中所有变量的声明，均使用var关键字。变量具体是什么数据类型，取决于给变量赋值的类型；
②同一个变量，可以在多次不同赋值时，修改变量的数据类型；
var a = 10；// 从初始声明是，a属于整数型；
a = "haha";// 重复赋值时，整数型的a被修改为字符串类型；
③变量可以使用var声明，也可以不使用var声明；
[区别] 使用var声明为局部变量，不使用var声明为全局变量；
④只用var声明，但是不赋值。结果为undefined；
例如： var a； // a为undefined。
但是，如果不声明也不赋值的a，直接使用会报错；
⑤同一变量名，可以多次使用var声明。但是，后年的var并没有任何作用。第二次使用声明时，只会被理解为普通的赋值操作。
2、变量名的命名要求：
①变量名只能有字母、数字、下划线组成；
②开头不能是数字；
③变量名区分大小写，大写字母和小写字母为不同变量；纯大写字母，一般默认为常量；
3、变量名的命名规范：
①要符合小驼峰法则：
首字母小写，之后每个单词的首字母大写；
myNameIsJiangHao 骆驼命名法：
② 所有字母小写，中间用
_my_name_is_jiang_hao 匈牙利写法
③ manameisjianghao 能用 但是不规范
4、JS中的数据类型：
Undefined：未定义、已经使用var声明的变量，但是没有赋值。var a；
Null：表示空的引用。
Boolean：布尔类型。表示真假，只有两个值： true/flase
Number: 数值类型。可以是正数，也可以是小数；
String： 字符串类型。用""或‘‘包裹的内容，称为字符串；
Object： 对象类型，后续讲解。。。。
5、[常用的数值函数]
①isNaN（）：判断一个变量或常量，是否是NaN( not a num 非数值)；
使用isNaN()判断时，会尝试使用Number（）函数进行转换，如果最终结果能够转换数字，则不是NaN,结果为false；
②number()函数： 将其他类型的数据，尝试转为数值型；
[字符串类型]
<<<字符串为纯数值字符串，会转为对应的数字；"111"→111
>>>字符串为空字符串，会转为0： " "-> 0
>>>字符串包含任何其它字符时，都不能转；"1a"->NaN
[Boolean类型]
true->1 false->0
[Null/Undefined]
Null->0 Undefined->NaN
[Object]
③ParseInt():将字符串转为整数类型；
>>>纯数值字符串，能转。"12"->12;"12.9"->12(小数转化时，直接抹掉小数点，不进行四舍五入)
>>>空字符串，不能转。" "->NaN
>>>包含其它字符的字符串，会截取第一个非数值字符串前的数字部分；
"123a456"->123;"a123b456"->NaN
>>>ParseInt()只能转字符串，转其它类型，全是NaN.
[number函数与ParseInt函数的区别]
1、Number函数可以转各种数据的类型，ParseInt函数只能转字符串；
2、两者在转字符串时，结果不完全相同。(详见上面解释)
④ParseFloat：将字符串转为数值型；
转换规则与ParseInt相同，只是如果有小数，则保留小数点；如果没有小数，则依然是整数；"12.5"->12.5;"12"->12
⑤typeof：检测变量的数据类型：
字符串->String 数值->Number 未定义->Undefined 对象/NULL->object 函数->function
true/false->Boolean
【JS中常用的输入输出语句】
1.document.write();将（）中的内容打印输出到留言器屏幕上；
使用时需要注意：除变量/常量外的所有内容，必须放到""中。变量和常量必须放到""外面；
如果同时有变量和字符串，必须用+连接；
eg：document.write（"左手中的纸牌"+left+"<br />"）;
2.alect（）；使用弹窗输出；
弹窗警告，（）中的内容与上述要求相同。
3.prompt（）；弹窗输入；
接受两部分参数：
①输入框上面的提示内容，可选；
②输入框里面的默认信息，可选；
当只写一部分时，表示输入框上面的提示内容；
可以定义变量，接受输入的内容。点击确定按钮，变量将被赋值为输入的内容；点击取消按钮，变量将被赋值为null；
6、JS的常用运算符
1、算术运算(单目运算符)
+ 加、-减、*乘、 /除、 %取余、++自增 、--自减
+号：有两种作用，连接字符串/加法运算。当+两边连接数字时，进行加法运算；当+两边有任意一边为字符串时，起连接字符串作用，
链接之后的结果为字符串；
除+外，其余符号运算时，会先尝试将左右两边的变量用Number函数转为数字；
>>>/:结果保留小数点；
>>>++:自增运算时，将变量在原有基础上+1；
>>>--:自减运算符，将变量在自身基础上-1；
【a++和++a的异同点】
①相同点：无论a++还是++a，运算完以后，a的值均会+1；
②不同点： a++，先用a的值去运算，再把a+1；
++a，先把a+1，再用a+1以后的值去运算。
eg：量、var a=3，b，c；
b=a++ +2；//先用a运算，b=3+2 再把a+1，a=4；
c=++a +2；//先把a+1，a=5再用a+1以后的值去运算，c=5+2；
2、赋值运算
= += -= *= /= %=
+=：a+=b；相当于a=a+b；但是前者的运算效率要比后者快，所以推荐使用+=的写法；
3、关系运算
==、 ！=、>、<、>=、<=
>>> 关系运算符，运算之后的结果，只能是Boolean类型；
>>> 判断一个数字是否处于一个区间，必须用&&链接；
a<10 && a>0 √ ; 10>a>0 x
>>> ===:严格等于；要求不但类型要相同，值也必须相同；类型不同结果直接为false，类型相同，再进行下一步判断；
== ：等于。类型相同，同===一样，类型不同时，会先尝试用Number将两边转为数字，然后再进行判断。
但是，有个别特例： Null==false x ；Null==Undefined √
！=：不等、！== 不全等
4、条件运算符(多目运算)
a>b?true:false
有两个重要符号： ？ 和 ：
当？前面部分，运算结果为true时，执行：前面的代码；
当？前面部分，运算结果为false时，执行：后面的代码；
冒号两边可以为数值，则整个式子可用于赋值。Var a= 1<2?1:2
冒号两边可以为代码块，将直接执行代码。1<2?alert(1):alert(2);
多目运算符可以多层嵌套。var a = 1<2?alert(1):(1>0?4:5)
5、 位运算符、 逻辑运算符
&、|、~ &&与、||或、！非
&& 两边都成立，结果为true
|| 两边有任意一个成立，结果为true
三、JS中的分支和循环属性
一、JS中的分支
【if-else结构】
1、结构的写法：
if(){
//条件为true时，执行if的{}
}else{
//条件为false时，执行else的{}
}
2、注意事项：
①else{}语句块。可以根据情况进行省略。
②if和else后面的大括号可以省略，但是省略大括号后，if和else后面只能跟一条语句，不建议省略；
3、if的（）中的判断条件，支持的情况：
①Boolean：true为真；false为假；
②String：空字符串为假，所有非空字符串为真；
③Number：0为假；一切非零数字为真；
④null/Undefined/NaN:全为假；
⑤object：全为真；
【多重if、阶梯if结构】
1、if（条件一）{
//条件一成立，执行的操作
}else if（条件二）{
//条件一不成立&&条件二成立，执行的操作
}else if（条件三）{
//条件一不成立&&条件二不成立，执行的操作
}
2、多重if结构中，各个判断条件是互斥的，执行选择其中一条路执行。遇到正确选项并执行完以后，直接跳出结构，不再
判断后续分支；
【嵌套if结构】
1、结构写法：
if(条件一){
//条件一成立
if（条件二）{
//条件一成立&&条件二成立
}else{
//条件一成立&&条件二不成立
}
}else{//条件一不成立
if（条件二）{
条件一不成立&&条件二成立
}else{
条件一不成立&条件二不成立
}
}
2、在嵌套结构中，如果省略{}，则else结构永远属于离它最近的一个if结构。
3、嵌套结构可以多层嵌套，但是一般不超过三层，能用多重结构的不用嵌套结构。
二、JS中的循环结构
【while(){}循环结构的步骤】
1、声明循环变量
2、判断循环条件
3、执行循环体操作
4、更新循环变量
然后循环执行2-4，直到条件不成立时跳出循环。
while循环()中的表达式，运算结果可以是多种类型，但是最终都会转为真假，转换规则同if结构
（1）、boolean类型：true为真，false为假
（2）、string类型：所有非空字符串为真，空字符串为假
（3）、number类型：一切非零数字为真，零为假
（4）、null、undefined、NaN：全为假
（5）、object类型：全为真。
var num=1; //声明循环变量
while (num<=10){ //判断循环条件
document.write(num+"<br />");//执行循环体操作
num++; //更新循环变量
}
【 while循环与do-while循环的区别:】
while循环是先判断再循环;
do-while循环是先执行再判断,即便是条件不成立,该循环也最少执行一次.
var num=10;
do{
document.write(num+"<br />");
num--;
}
while(num>=0);
【for循环】
1、for循环有三个表达式：
① 声明循环变量;
② 判断循环条件;
③ 更新循环变量;
三个表达式之间用;分隔开,三个表达式可以省略,但是两个分号不能省略.
2、for循环的执行特点:先判断再执行，和while相同；
执行顺序：1、初始语句 2、执行条件是否符合？ 3、循环体 4、增加增量 ；
3、for循环三个表达式均可以由多部分组成，第二部分多个判断条件用&& 、||连接，其他部分可以用，连接。
将上部while循环改为for循环如下:
for(var num=1; num<=10;num++){
document.write(num+"<br />")
}
【循环控制语句】
1、break：跳出本层循环，继续执行后面的语句。
如果循环有多层嵌套,则只能跳出来一层循环；
2、continue：跳过本次循环剩余的代码继续执行下一次循环；
①、对于for循环：continue之后执行的语句，是循环变量更新语句i++；
②、对于while、do-while循环，continue之后执行的语句，是循环条件判断。// 因此在使用这两个循环时，必须将continue放到i++之后使用。否则，continue将跳过i++，变成死循环。
三、JS中的函数和DOM
一、JS中的函数
函数的声明及调用
1、函数的声明格式：
function 函数名（参数一，参数二，...）{
//函数体代码
return 返回值；
}
函数的调用：
① 直接调用：函数名加（参数一的值，参数二的值,.......)；
② 事件调用：HTML标签中，使用事件名="函数名（）"
<button onclick="saySth(‘hahha‘,‘yellow‘)">点击按钮，打印内容</button>
2、函数的注意事项：
① 函数必须要符合小驼峰法则！！！（首字母小写，之后每个人单词首字母大写）
② 函数名后面的（）中，可以有参数，也可以没有参数。分别称为有参函数和无参函数；
③ 声明函数时的参数列表，称为型参列表，形式参数。（变量的名字）
function saySth(str,color){}
调用函数时的参数列表，称为实参列表，实际参数。（变量的赋值）
saySth("哈哈哈","red");
④ 函数的形参列表个数和实参列表个数没有实际关系。
函数参数的个数，取决于实参列表。
如果实参列表的个数<形参列表,则未赋值的形参，将为Undefined。
⑤ 函数可以有返回值，使用return返回结果；
调回函数时，可以使用一个变量接受函数的返回结果。如果函数没有返回值，则接受的结果为undefined；
function func(){
return = "hahaha";
}
var num = func()；//num = "hahaha"
⑥ 函数变量的作用域：
在函数中，使用var声明的变量，为局部变量，只能在函数内部访问；
不使用var声明的变量，为全局变量，在函数外边也能访问；
函数的形象列表，默认为函数的局部变量，只能在函数内部使用；
⑦ 函数的声明与函数的调用，没有先后之分。即，可以在声明函数之前，调用函数。
func（）；//声明func之前调用也是可以的。
function func(){}
匿名函数的声明和使用
1、声明一个匿名函数直接赋值给某一个事件；
window.onload = function（）{}
2、使用匿名函数表达式；将匿名函数，赋值给一个变量。
声明：var func = function(){}
调用：func()；
注意：使用匿名函数表达时，函数的调用语句，必须放在函数声明语句之后！！！（与普通函数的区别！！！）
3、自执行函数
① ！function(){}();//可以使用多种运算符开头，单一版用！；
！function(形参列表){}(实参列表)；
② (function(){}());//使用()将函数及函数后的括号包起来；
③ (function(){})();//使用()值包裹函数部分；
三种写法的特点：
① 第一种使用！开头，结构清晰，不容易混乱，推荐使用；
② 第二种写法能够表明匿名函数与调用的()为一个整体，官方推荐使用；
③ 第三种无法表明函数之后的()的整体性，不推荐使用；
JS代码的执行顺序问题
* JS代码在运行时，会分为两大部分。检查装载和执行阶段
* 检查装载阶段： 会先检测代码的语法错误，进行变量、函数的声明。
*
* 执行阶段：变量的赋值、函数的调用等，都属于执行阶段。
*
* 以下列代码为例：
* consoloe.log();
* var num = 10;//dundefined
*
* func1(); //函数正常执行
* function func1(){};
*
* func2(); //函数不能执行，打印func2时显示undefined
* var func2 = function{}
*
* 原因：上述代码的执行顺序为：
*
* --------------------检查装载阶段--------------------
* var num；
* function func1（）{}
* var func2
*
* --------------------代码执行阶段--------------------
* consoloe.log(num); undefined; var num =10;
* function func1(){};
*
* func2(); =function(){}
二、函数中的DOM操作
【DOM节点】
DOM节点分为三大类：元素节点、属性节点、文本节点；
文本节点、属性节点属于元素节点的子节点。操作时，均需要先取到元素节点，再操作子节点。
可以使用getElement系列方法
【查看元素节点】
1、 getElementById：通过id取到唯一节点。如果id重名只能取到第一个；
getElementsByName() ：通过name属性
getElementsByTagName() ：通过标签名
getElementsByClassName() ：通过class名
>>>获取元素节点时，一定要注意：获取节点的语句，必须在DOM渲染完成之后执行。可以有两种方式实现：① 将
JS代码写在body之后； ② 将代码写到window.onload函数之中；
>>>后面三个getElements，取到的是数组格式，不能直接添加各种属性，而应该取出数组的每一个单独操作。例如：
【查看/设置属性节点】
1、查看属性节点：getAttribute("属性名")；
2、设置属性节点：setAttribute("属性名"，"属性值")；
>>>查看和设置属性节点，必须取到元素节点，才能使用。
>>> setAttribute();函数在IE浏览器中可能会存在兼容性问题。比如在IE中不支持使用这个函数设置style/onclick等样式属性和事件属性。
>>> 我们推荐使用点符号法替代上述函数：
eg: dom1.style.color="" dom1.onclick="" dom1.src=""
【总结-JS修改DOM节点的样式】
1、 使用setAttribute()设置class和style属性，但是存在兼容性问题，不提倡
div.setAttribute("class","cls1");
2、 使用.className直接设置class类,注意是className而不是.class：
div.className = "cls1";
3、 使用.style设置单个属性，注意属性名要是用驼峰命名法：
div.style.backgroundColor = "red";
4、 使用.style 或 .style.cssText 设置多个样式属性：
div.style = "background-color:red; color:yellow;"
div.style.cssText = "background-color:red; color:yellow;" √
【查看设置文本节点】
1、 .innerText: 取到或设置节点 里面文字内容；
.innerHTML: 取到或设置节点里面的HTML代码；
.tagName: 取到当前节点的标签名。 标签名全部大写显示。
【根据层次获取节点】
1 .childNodes： 获取元素的所有子节点。包括回车等文本节点。
.children: 获取当前元素的所有元素节点(只获取标签)。
2 .firstChild: 获取元素的第一个子节点。包括回车等文本节点。
.firstElementChild: 获取元素的第一个子节点。不包括回车等文本节点。
.lastChild: 获取元素的最后一个子节点。包括回车等文本节点。
.lastElementChild:
3 .parentNode: 获取当前节点的父节点。
4 .previousSibling: 获取当前节点的前一个兄弟节点；包括回车等文本节点。
.previousElementSibling:
5 .nextSibling: 获取当前节点的后一个兄弟节点；包括回车等文本节点。
.nextElementSibling:
6 .getAttributes: 获取当前节点的属性节点。
【创建并新增节点】
1. document.createElement("标签名")：创建节点 。需要配合 setAttribute设置各种新的属性；
2. 父节点.appendChild(新节点)：末尾追加方式插入节点
3. 父节点.insertBefore(新节点,目标节点)：在目标节点前插入新节点.
4. 被克隆节点.cloneNode(true/false)：克隆节点
>>> 传入true： 表示克隆当前节点，以及当前节点的所有字节点；
>>> 传入false或不传： 表示只克隆当前节点，而不克隆子节点。
【删除或替换节点】
1. 父节点.removeChild(被删节点): 删除父节点中的子节点；
2. 父节点.replaceChild(新节点,老节点): 使用新节点，替换掉老节点。
【表格对象】
1、row属性：返回表格中的所有行，是一个数组格式；
2、insertRow(index):在指定位置插入一行，index从0开始；
3、deleteRow(index):删除指定的一行，index从0开始；
【行对象】
1、cells属性：返回这一行中的所有单元格，是一个数组格式；
2、rowIndex属性：返回这一行是表格中的第几行，从0开始；
3、insertCell(index):在这一行指定位置，插入一个单元格，index从0开始；
4、deleteCell(index):删除这一行的指定单元格，index从0开始
【单元格对象】
1、cellIndex属性：返回这个单元格是本行的第几个，从0开始；
2、innerText innerHTML align className
[表格对象]
1、 rows属性： 返回表格中的所有行，是一个数组格式；
2、 insertRow(index): 在指定位置插入一行，index从0开始；
3、 deleteRow(index): 删除指定的一行，index从0开始；
[行对象]
1、 cells属性： 返回这一行中的所有单元格，是一个数组格式；
2、 rowIndex属性： 返回这一行是表格中的第几行，从0开始；
3、 insertCell(index): 在这一行指定位置，插入一个单元格，index从0开始；
4、 deleteCell(index): 删除这一行的指定单元格，index从0开始
[单元格对象]
1、 cellIndex属性： 返回这个单元格是本行的第几个，从0开始；
2、 innerText innerHTML align className
三、JS中的事件
【JS中的事件分类】
1、鼠标事件
click、dbclick、onmouseover、onmouseout
2、HTML事件
onload/onscroll/onsubmit/onchange/onfocus
3、键盘事件
keydown：键盘按下时触发
keypress：键盘按下并松开的瞬间触发
keyup：键盘抬起时触发
[注意事项]
①执行顺序：keydown->keypress->keyup
②当长按时：会循环执行keydown->keypress
③有keydown不一定有keyup，当事件触发过程中，鼠标将光标移走，将导致没有keyup
④keypress只能捕获键盘上的数字、字符、符号键，不能捕获各种功能键，而keydown和keyup可以。
⑤keypress支持区分大小写，keydown和keyup并不支持
[确定触发的按键]
①再触发的函数中传入一个参数e，表示键盘事件；
②使用e.keyCode，取得按键的Ascii码值，进而确定触发按键；
③所有浏览器的兼容写法(一般并不需要)
var evn = e || event ；
var code = evn.keyCode || evn.which || evn.charCode；
【JS中的DOM0事件模型】
1、内联模型(行内绑定)：直接将函数名作为HTML标签的某个事件属性的属性；
eg：<button onclick="func()">DOM0内联模型</button>
优点：使用方便；
缺点：违反了W3C关于HTML与JavaScript分离的基本原则；
2、脚本模型(动态绑定)：在JS脚本中取到某个节点，并添加事件属性；
eg：window.onload = function(){}
优点：实现了HTML与JavaScript的分离
缺点：同一个节点，只能绑定一个同类型事件。如果绑定多次，则最后一个生效。
【DOM2事件模型】
1、添加事件绑定方式：
①：IE8之前：btn2.attachEvent("onclick",函数)；
②：其他浏览器:btn2.addEventListener("click",函数,true/false);
参数三：false(默认) 表示事件冒泡 true 表示事件捕获
③：兼容写法：if(btn2.attachEvent){
btn2.attachEvent();
}else{
btn2.addEventListener();
}
2、优点：①可以给同一个节点，添加多个同类型属性；
②提供了可以取消事件绑定的函数。
3、取消DOM2事件绑定：
注意：如果要取消DOM2的事件绑定，那么在绑定事件时，处理函数必须要使用有名函数，而不能使用匿名函数；
【JS中的事件流】
1、事件冒泡
当某DOM元素触发一种事件时，会从当前节点开始，逐级往上触发其祖先节点的同类型事件，直到DOM根节点；
>>>什么情况下会产生事件冒泡？
①DOM0模型绑定事件，全部都是冒泡；
②IE8之前，使用attachEvent()绑定的事件，全部是冒泡；
③其他浏览器，使用addEventLinstener()添加事件，当第三个参数省略或者为false时，为事件冒泡；
2、事件捕获：当某DOM元素触发一种事件时，会从文档根节点开始，逐渐向下触发其祖先节点的同类型事件，直到
该节点自身；
>>>什么情况下会产生事件捕获？
①使用addEventLinstener()添加事件，当第三个参数为true时，为事件捕获；
↓ DOM根节点 ↑
↓ ↑
捕 爷爷节点 冒
↓ ↑
获 父节点 泡
↓ ↑
↓ 当前节点 ↑
3、阻止事件冒泡：
在IE浏览器中，使用e.cancelBubble = true ；
在其他浏览器中，使用e.stopPropagation();
兼容所有浏览器中的写法：
function myParagraphEventHandler(e) {
e = e || window.event;
if (e.stopPropagation) {
e.stopPropagation(); //IE以外
} else {
e.cancelBubble = true; //IE8之前
}
}
4、取消默认行为：
在IE浏览器中，使用e.returnValue = false；
在其他浏览器中，使用e.preventDefault();
兼容所有浏览器写法：
function eventHandler(e) {
e = e || window.event;
// 防止默认行为
if (e.preventDefault) {
e.preventDefault(); //IE以外
} else {
e.returnValue = false; //IE
}
}
四、JS中的内置对象
一、JS中的数组
1、数组的基本概念？
数组是在内容空间中连续存储的一组有序数据的集合
元素在数组中的顺序，成为下标。可以使用下标访问数组的每个元素。
2、如何声明一个数组：
①使用字面量声明：var arr = [];
在JS中同一数组可以存储各种数据类型。
例如：var arr = [1,"jianghao",true,{},null,func];
②使用new关键字声明：var arr = new Array(参数);
>>>参数可以是：
a.参数省略表示创建一个空数组；
b.参数只放一个整数表示声明一个length为指定长度的数组，但是这个length可以随时可变可追加；
c.参数为逗号分隔的多个数值，表示数组的多个值。
new array(1,2,3) == [1,2,3]
3、数组中元素的读写/增删？
①读写：通过下标访问元素。下标从0开始，arr[1] = "hahaha";
②增删：
a.使用delete关键字，删除数组的某一个值。删除之后，数组的长度不变，对应的位置变为Undefined。
eg：delete arr[1]；
b.arr.pop():删除数组的最后一个值。相当于arr.length -= 1；
c.arr.shift():删除数组的第一个值；
d.arr.unshift(值):在数组的第0个位置增加一个值；
4、数组中的其它方法
①join():将数组用指定分隔符链接为字符串。单参数为空时，默认逗号分隔。
②contact():【原数组不会被改变】 将数组，与两个或多个数组的值链接为新数组；
concat连接时,如果有二维数组，则至多能拆一层[]
[1,2].concat([3,4],[5,6])->[1,2,3,4,5,6]
[1,2].concat([3,4,[5,6]])->[1,2,3,4,[5,6]]
③push():数组最后增加一个，unshift()数组开头增加一个。-返回新数组的长度
pop() 数组最后删除一个，shift() 数组开头删除一个。-返回被删除的值
【上述方法均会改变原数组】
④reverse():【原数组被改变】,将数组反转，倒序输出；
⑤slice():【原数组不会被改变】 截取数组中的某一部分，并返回截取的新数组；
>>>传入一个参数，表示开始区间，默认将截到数组最后；
>>>传入两个参数，表示开始和结束的下标，左闭右开区间(包含begin，不包含end)
>>>两个参数可以为负数，表示从右边开始数，最后一个值为-1；
⑥sort()：【原数组被改变】将数组进行排列
>>>默认情况下，会按照每个元素首字母的ASII值进行排序；
[3,1,2,15].sort() -> [1,15,2,3];
>>>可以传入一个比较函数，手动指定排序的函数算法；
函数将默认接收两个值a，b 如果函数返回值>0，则证明a>b.
arr.sort(function(){
return a-b;升序排列
return b-a;降序排列
})
⑦ indexof(value,index):返回数组中第一个value值所在的下标，如果没有找到返回-1；
lastIndexof(value,index):返回数组中最后一个value值所在的下标，如果没有找到返回-1；
>>>如果没有制定index，则表示全数组中查找value；
>>>如果指定了index，则表示从index开始，向后查找value；
⑧ forEach():专门用于循环遍历数组。接收一个回调函数，回调函数接收两个参数，第一个参数为该数组的
每一项值，第二个参数为下标；
【IE8之前，不支持此函数】
⑨ map():数组映射，使用方式与foreash()使用方式相同。不同的是，map可以有返回值，表示将原数组的每个值
进行操作后，返回给一个新数组。
5、二维数组和稀疏数组
① 二维数组：数组中的值，依然是一个数组形式。
eg： arr = [[1,2,3],[4,5,6]] 相当于两行三列；
读取二维数组：arr：[行号][列号]；
② 稀疏数组：数组中的索引是不联系的。(length要比数组中的实际元素个数大)；
6、基本类型和引用数据类型：
① 基本数据类型：赋值时，是将原变量中的值，赋值给另一个变量，赋值完成后，两个变量相互独立，修改其中
一个的值，另一个不会变化；
② 引用数据类型：赋值时，是将原变量在内存中的地址，赋值给另一个变量。赋值完成后，两个变量中存储的时同一个
内存地址，访问的是同一份数据，其中一个改变另一个也会发生改变；
③ 数值型、字符串、布尔类型等变量属于基本数据类型；
数组，对象属于应用数据类型
二、JS中的内置对象
Boolean 类
也有两种声明方式：
可以使用字面量方式声明一个单纯的变量；用typeof检测为Boolean类型
也可以使用new Boolean() 声明一个Boolean类型的对象。用typeof检测为Object类型
.toString:将数值类型转化为字符串类型
.toLocaleString：将数值按照本地格式顺序转换为字符串，一般从右边开始，三个一组加逗号分隔；
.toFixed(n)：将数字保留n位小数，并转为字符串格式；
.toPrecision(n):将数字格式化为指定长度。n表示不含小数点的位数长度。如果n<原数字
.valueOf():返回Number对象的基本数字值；
Number类
Number.MAX_VALUE 返回Number类可表示最大值
Number.MIN_VALUE 返回Number类可表示最小值
var num1 = 10
var num2 = new Number(10);
//console.log(typeof num1);
//console.log(Number.MIN_VALUE);
String 类
1、属性：str。length ：返回字符串的长度，字符数；
字符串支持类似于数组下标的访问方式：str[0]
2、方法：
.toLowerCase():字符串所有字符转成小写；
.toUpperCase()：字符串所有字符转成大写；
.chaAt(0)
.indexOf("str",index):从index位置开始，查找子串在在字符中出现的位置，如果没有返回值-1,
其它数组的indexOf方法;
.lastIndexOf:同数组；
.substring(begin,end)：从字符串中截取子串
>>>只传入一个参数，表示从begin开始，到最后；
>>>传入两个参数，表示从begin到end的区间，左闭右开；
.split("分隔符")：将字符串以指定分隔符分隔，存入数组中。
传入空""表示将字符串的每个字符分开放入数组。
.replace("old","new"):将字符串中的第一个old替换为new。
>>>第一个参数，可以是普通字符串，也可以是正则表达式；
>>>如果是普通字符串，则只替换第一个old。如果是正则表达式，则可以根据正则的方法
Date 日期类
1、new Date():返回当前最新时间；
new Date("2017,8,23,12:34:56");
.getFullYear()：获取4位年份；
.getMonth()：获取月份0-11；
.getDate():获取一个月中的第几天 1-31
.getDay():获取一周中的第几天 0-6,0表示周天
三、JS中的自定义对象
【自定义对象】
1、基本概念：
① 对象：对象是拥有一系列无属性和方法的集合。
② 键值对：对象中的数据是以键值对的形式存在。对象的每个属性和方法都对应着一个键名，我们可以以键
取值。
③ 属性：描述对象特征的一系列变量，称为属性。【对象中的变量】
④ 方法：描述对象行为的一系列函数，称为方法。【对象中的函数】
2、对象的声明：
① 使用字面量声明： var obj = {
key1 ：value1,
key2 ：value2,
func1：function(){}
}
>>> 对象中的数据是以键值对的形式存储，键与值之间用：分隔。
多个键值对之间用,分隔。
>>> 对象中的键可以是除了数组和对象以外的任何数据类型，但是一般我们只用普通变量名作为键。
>>> 对象中的值可以是任何数据类型，包括数组和对象。
② 使用new关键字声明： var obj = new Object();
obj.key1 = value1;
3、对象中属性和方法的读写：
① .运算符：对象名.属性 对象名.方法();
② 通过中括号["key"]调用： 对象名.["属性名"] 对象名.["方法名"]();
>>>如果键中包含特殊字符则只能使用第二种方式给；
>>>对象中，直接写变量名，默认为调用全局变量。如果需要调用对象自身的属性或者方法。需要使用
对象名.属性,或者this.属性。
person.age this.age 都可以，但推荐使用this关键字。
③ 删除对象的属性和方法： delete 对象名属性名/方法名
的；delete person.age;
写在最后：
感谢读者在繁忙之中欣赏博主菜菜的随笔，希望读者能够对博主提出宝贵的意见，博客定当认真对待！
以上是关于---------走过夏天，一路慢行的JavaScript之旅（add）！！！的主要内容，如果未能解决你的问题，请参考以下文章