4. javaScript基础学习笔记(下)

4. javaScript基础学习笔记(下)

32 数组

解析：数组也是对象，和普通对象功能类似，也是用来存储一些值

数组分类

1. 内建对象
2. 宿主对象
3. 自定义对象

普通对象与数组对象区别

1. 普通对象使用字符串作为属性名
2. 数组使用数字来作为索引操作元素

索引

1. 从0开始的整数就是索引
2. 数组的存储性能比普通对象要好，在开发中经常使用数组来存储数据

构造函数创建数组对象

例如：var arr = new Array();

数组添加元素

语法：数组[索引] = 值

例如: arr[0] = 10;

读取数组元素

语法：数组[索引]

例如：console.log(arr[3]);

特殊: 如果读取不存在的索引，不会报错而是返回undefined

获取数组长度

解析：使用length属性来获取数组的长度(元素的个数)

语法：数组.length

连续数组与非连续数组

解析：

1. 连续的数组，使用length可以获取到数组的长度
2. 非连续的数组，使用length会获取到数组的最大的索引+1（尽量不要创建）

修改数组length

1. 修改的length大于原长度，则多出部分会空出来

例如：var arr = [1,2,3]

​ arr.length = 4;

​ console.log(arr); //1，2，3，，

2. 修改的length小于原长度，则多出的元素会被删除

例如：var arr = [1,2,3]

​ arr.length = 2;

​ console.log(arr); //1，2

数组最后位置添加元素

语法：数组[数组.length] = 值;

例如： arr[arr.length] = 90;

数组字面量

语法: []

例如： var arr = [1, 2, 3, 4, 5, 10];

构造函数数组创建时添加元素

解析：将要添加的元素作为构造函数的参数传递，元素之间使用逗号隔开

例如： var arr2 = new Array(10, 20, 30);

数组元素构成

解析：数组中的元素可以是任意的数据类型，包括：对象、数组、函数

例如：

var arr = [“hello”, 1, true, null, undefined,{ name: “孙悟空” },[1, 2, 3],function () { alert(1) }];

32.1 数组方法

32.1.1 push()

解析：

1. 该方法可以向数组的末尾添加一个或多个元素，并会将数组新的长度作为返回值返回；
2. 可以将要添加的元素作为方法的参数传递，

例如： var arr = [“孙悟空”, “猪八戒”, “沙和尚”];

​ var result = arr.push(“唐僧”);

​ console.log(arr); //[“孙悟空”, “猪八戒”, “沙和尚”, “唐僧”]

​ console.log("result = "+result); //4

32.1.2 pop()

解析：该方法可以删除数组的最后一个元素,并将被删除的元素作为返回值返回

例如： var arr = [“孙悟空”, “猪八戒”, “沙和尚”];

​ result = arr.pop();

​ console.log(arr);//[“孙悟空”, “猪八戒”]

​ console.log("result = "+result);//[’‘唐僧’’]

32.1.3 unshift()

解析：

1. 向数组开头添加一个或多个元素，并返回新的数组长度
2. 向前边插入元素以后，其他的元素索引会依次调整

例如： arr.unshift(“二郎神”);

​ console.log(arr); //[’‘二郎神’’,“孙悟空”, “猪八戒”, “沙和尚”, “唐僧”]

32.1.4 shift()

解析： 可以删除数组的第一个元素，并将被删除的元素作为返回值返回

result = arr.shift();

console.log("result = " + result); //[’‘孙悟空’’]

32.1.5 slice(a,b)

解析：用来从数组提取指定元素；该方法不会改变元素数组，而是将截取到的元素封装到一个新数组中返回

参数：

1. 截取开始的位置的索引,包含开始索引
2. 截取结束的位置的索引,不包含结束索引

特殊：

1. 第二个参数可以省略不写,此时会截取从开始索引往后的所有元素
2. 索引可以传递一个负值，如果传递一个负值，则从后往前计算

​ -1 倒数第一个

​ -2 倒数第二个

例如： var arr = [“孙悟空”, “猪八戒”, “沙和尚”, “唐僧”, “白骨精”];

var result = arr.slice(1, 4);// [ “猪八戒”, “沙和尚”, “唐僧”];

result = arr.slice(3);// [ “唐僧”, “白骨精”];

result = arr.slice(1, -2);// [ “猪八戒”, “沙和尚”];

32.1.6 splice()

解析：splice可以用于删除数组中的指定元素，使用splice()会影响到原数组，会将指定元素从原数组中删除，并将被删除的元素作为返回值返回

参数：

1. 第一个，表示开始位置的索引
2. 第二个，表示删除的数量
3. 第三个及以后可以传递一些新的元素，这些元素将会自动插入到开始位置索引前边

例如： arr = [“孙悟空”, “猪八戒”, “沙和尚”, “唐僧”, “白骨精”];

​ var result = arr.splice(3, 1);

​ console.log(arr);// [“孙悟空”, “猪八戒”, “沙和尚”, “白骨精”];

​ console.log(result);//[“唐僧”]

32.1.7 concat

解析：

1. 可以连接两个或多个数组，并将新的数组返回
2. 该方法不会对原数组产生影响

例如：

var arr = [“孙悟空”];

var arr2 = [“白骨精”];

var arr3 = [“蜘蛛精”];

var result = at(arr2, arr3, “牛魔王”); // [“孙悟空”, “白骨精”, “蜘蛛精”, “牛魔王”]

32.1.18 join

解析：

1. 该方法可以将数组转换为一个字符串
2. 该方法不会对原数组产生影响，而是将转换后的字符串作为结果返回
3. 在join()中可以指定一个字符串作为参数，这个字符串将会成为数组中元素的连接符；如果不指定连接符，则默认使用逗号作为连接符

例如：

var arr = [“孙悟空”, “猪八戒”];

result = arr.join("@-@");//孙悟空@-@猪八戒

32.1.9 reverse

解析: 该方法用来反转数组（前边的去后边，后边的去前边）

例如： var = [“孙悟空”, “猪八戒”, “沙和尚”];

​ verse(); // [“沙和尚”, “猪八戒”, “孙悟空”]

32.1.10 sort()

解析：

1. 可以用来对数组中的元素进行排序
2. 也会影响原数组，默认会按照Unicode编码进行排序

例如:

arr = [“b”, “d”, “e”, “a”, “c”];

arr.sort(); //[“a”, “b”, “c”, “d”, “e”]

特殊：即使对于纯数字的数组，使用sort()排序时，也会按照Unicode编码来排序，因此可能会得到错误的结果。

自定义排序规则

解析：

1. 在sort()添加一个回调函数，来指定排序规则；回调函数中需要定义两个形参
2. 浏览器将会分别使用数组中的元素作为实参去调用回调函数，使用哪个元素调用不确定，但是肯定的是在数组中a一定在b前边
3. 浏览器会根据回调函数的返回值来决定元素的顺序，如下：

​ (1) 1 如果返回一个大于0的值，则元素会交换位置

​ (2) -1 如果返回一个小于0的值，则元素位置不变

​ (3) 0 如果返回一个0，则认为两个元素相等，也不交换位置

​ (4) 如果需要升序排列，则返回 a-b

​ (5) 如果需要降序排列，则返回b-a

例如：arr = [2,1,3];

arr.sort(function (a, b) {

//前边的大，是倒序

if(a > b){ return -1;

}else if(a < b){return 1;

}else{return 0; }//[3, 2,1]

//升序排列

// return a - b;

//降序排列

// return b - a; });

32.2 数组遍历

32.2.1 for

解析：

1. 遍历数组，将数组中所有的元素都取出来

例如： var arr = [“孙悟空”, “猪八戒”, “沙和尚”];

for (var i = 0; i < arr.length; i++) {

console.log(arr[i]);

}//孙悟空，猪八戒，沙和尚

32.2.2 forEach

解析：

1. 遍历数组，该方法只支持IE8以上的浏览器，不兼容IE8

2. 数组中有几个元素函数就执行几次，每次执行时，浏览器会将遍历到的元素以实参的形式传递进来，可以定义形参来读取这些内容

3. 浏览器会在回调函数中传递三个参数：

   第一个参数，就是当前正在遍历的元素

   第二个参数，就是当前正在遍历的元素的索引

   第三个参数，就是正在遍历的数组

例如： var arr = [“孙悟空”,“猪八戒”];

​ arr.forEach(function(value , index , obj){

​ console.log(value); });//孙悟空,猪八戒

其他知识：像forEach这种函数，由我们创建但是不由我们调用的，我们称为回调函数

33 arguments对象

在调用函数时，浏览器每次都会传递进两个隐含的参数：

1. 函数的上下文对象 this
2. 封装实参的对象 arguments

（1）arguments是一个类数组对象,它也可以通过索引来操作数据，也可以获取长度

34 Date对象

解析：JS中使用Date对象来表示一个时间

Date对象创建

1. 直接使用构造函数创建一个Date对象，则会封装为当前代码执行的时间

   例如：var d = new Date();

2. 创建一个指定的时间对象，需要在构造函数中传递一个表示时间的字符串作为参数

​ 日期的格式 月份/日/年 时:分:秒

​ 例如：var d2 = new Date(“2/18/2011 11:10:30”);

34.1 getDate()

解析： 获取当前日期对象是几日

例如：var d = new Date();

var date = d.getDate();//5

34.2 getDay()

解析： 获取当前日期对象时周几，会返回一个0-6的值

​ 0 表示周日，1表示周一，以此列推

例如：var day = d2.getDay()；

34.3 getMonth()

解析：获取当前时间对象的月份，会返回一个0-11的值

0 表示1月，1 表示2月，… ， 11 表示12月

例如: var month = d2.getMonth();

34.4 getFullYear()

解析: 获取当前日期对象的年份

例如：var year = d2.getFullYear();

34.5 getTime()

解析： 获取当前日期对象的时间戳；

1. 时间戳，指的是从格林威治标准时间的1970年1月1日0时0分0秒到当前日期所花费的毫秒数（1秒 = 1000毫秒）

2. 计算机底层在保存时间时使用都是时间戳

   例如： var time = d2.getTime();

3. 可利用时间戳来测试代码的执行的性能

例如：var start = w();

for (var i = 0; i < 100; i++) {console.log(i); }var end = w();

console.log(“执行了：” + (end - start) + “毫秒”);

35 Math对象

解析：

1. Math和其他的对象不同，它不是一个构造函数。
2. 它属于一个工具类，不用创建对象，它里边封装了数学运算相关的属性和方法

35.1 Math.abs()

解析： abs()可以用来计算一个数的绝对值

例如： Math.abs(-1) // 1

35.il()

解析：可以对一个数进行向上取整，小数位只要有值就自动进1

35.3 Math.floor()

解析：可以对一个数进行向下取整，小数部分会被舍掉

35.und()

解析： 可以对一个数进行四舍五入取整