[TOC]
01-数组API
API(Application Programming Interface 应用程序接口)
本质就是函数<br /> Array.prototype 数组的原型对象<br /> 它的作用是用于保存 数组的 公有属性 和 公有方法<br /> 原型中 所有的属性和方法 都可以在实例(instance)对象中被访问<br /> 实例对象<br /> 在创建对象时(引用类型的数据) 被创建出的这个对象 就是该构造函数的实例对象<br /> var o = new Object(); o 是 Object的实例<br /> var arr = new Array(); arr 是 Array的实例<br /> -------------------------------------------
Array.prototype.push();
语法: arr.push(element[,...elementN]);<br /> 参数: element(any) 需要添加到数组尾部的元素<br /> 返回值: length(number) 返回添加元素后数组的新长度<br /> 描述: 在数组的结尾添加一个或多个元素 并返回添加元素后的数组长度<br /> var arr = [1, 2, 3, 4]; new Array(1,2,3,4) arr是Array的实例<br /> var len = arr.push(6, 7, 8);<br /> console.log(arr);<br /> console.log(len);<br /> ----------------------------------------------
Array.prototype.pop()
语法: arr.pop();<br /> 返回值: lastElement 数组的最后一个元素<br /> 描述: pop会删除并返回数组中的最后一个元素 将数组的长度-1<br /> var arr = [1, 2, 3, 4];<br /> var result = arr.pop();<br /> console.log(result);<br /> console.log(arr);<br /> -----------------------------------------------
Array.prototype.concat()
语法: arr.concat(value[,...value]);<br /> 参数: value(any) 可以是数组或值 所有的value会被依次添加到数组的结尾<br /> 返回值: array 新数组<br /> 描述: concat 用于 连接 或 合并数组<br /> var arr = [1, 2, 3];<br /> var arr2 = arr.concat(4, 5, 6);<br /> console.log(arr2);<br /> console.log(arr);<br /> var arr3 = [1, 2, 3];<br /> var arr4 = arr3.concat([4, 5, 6, 7, 8]);<br /> var arr5 = arr3.concat([4, [5, 6, 7], 8, 9]);<br /> concat 进行数组合并时 会自动展开最外层数组 内层数组不会被展开<br /> console.log(arr4);<br /> console.log(arr5);<br /> concat创建的新数组 是一个数组的浅拷贝<br /> 浅拷贝(最外层地址不同 内层如果有引用类型 则地址相同)<br /> arr7 的前两个元素 是由 arr6进行赋值的<br /> 引用类型进行赋值时 赋值的是 地址<br /> var arr6 = [1, [2, 3]];<br /> var arr7 = arr6.concat(4, 5, 6);<br /> arr6[1][0] = 0;<br /> console.log(arr6);<br /> console.log(arr7);<br /> ---------------------------------------<br /> var a = [1, 2, 3];<br /> var b = [1, 2, 3];<br /> console.log(a[0] === b[0]); 是基本类型比较<br /> var c = [[1, 2, 3], 4]; new Array(1,2,3)<br /> var d = [[1, 2, 3], 4]; new Array(1,2,3)<br /> console.log(c[0] === d[0]); false 引用类型比较地址
02-数组API(2)
Array.prototype.join();
语法: arr.join([separator]);<br /> 参数: separator(string) 连接符 默认值(',')<br /> 返回值: string 数组中元素连接后的字符串结果<br /> 描述: join 将数组中所有的元素都执行一次 toString 函数<br /> 将toString的结果使用 连接符 进行连接 形成一个字符串<br /> ECMAScript中 null 和 undefined 没有 toString 函数 为了保证代码运行安全 JS引擎将忽略这两个值<br /> 作用: 将数组中所有元素转成字符串 连接在一起<br /> var arr = [65, 12, 6, 'aaa', true, false, null, 123, undefined, , , { x: 1 }, [1, 2, 3]];<br /> var str = arr.join();<br /> console.log(str);<br /> console.log(arr);<br /> var arr2 = [1, 2, 3, 4, 5];<br /> var str2 = arr2.join('-');<br /> console.log(str2);<br /> var arr3 = [1, 2, 3, 4, 5];<br /> var str3 = arr3.join('');<br /> console.log(str3);<br /> -------------------------------------------------------
Array.prototype.reverse()
语法: arr.reverse()<br /> 返回值: 原数组<br /> 描述: reverse 将颠倒数组中的元素顺序<br /> var arr = [1, 2, 3, 4, 5];<br /> arr.reverse();<br /> console.log(arr);<br />
Array.prototype.shift()
慎用(大厂不允许) 性能差
————————————————————————————
语法: arr.shift()
返回值: firstElement 第一个元素
描述: shift 将删除并返回数组中的第一个元素 将剩余元素 向前移动 将数组的长度 -1
var arr = [1, 2, 3, 4, 5];
var reuslt = arr.shift();
console.log(reuslt);
console.log(arr);
————————————————————————————-
Array.prototype.unshift()
语法: arr.unshift(element[,...elementN]);<br /> 参数: element(any) 需要添加到数组头部的元素<br /> 返回值: length(number) 添加后数组的新长度<br /> 描述: unshift 将在数组的头部依次添加元素 将数组中原有的元素依次向后移动<br /> var arr = [1, 2, 3];<br /> var result = arr.unshift(4, 5);<br /> console.log(arr);<br /> console.log(result);
03- sort()
Array.prototype.sort()
描述: 通过特定的规则对数组中的元素进行排序<br /> 语法: arr.sort([compareFunction]);<br /> 参数: compareFunction(function) 比较函数(回调函数)<br /> 比较函数: 使用一个比较函数指定sort的排序规则. 如果省略,元素则按照 Unicode 进行排序<br /> 比较函数参数:<br /> firstElement 第一个用于比较的元素<br /> secondElement 第二个用于比较的元素<br /> 返回值: 原数组<br /> ---------------------------------------------------------------<br /> 默认情况下 数组将所有的元素 转换成字符串后 按照字符串的Unicode编码进行排序<br /> 升序排列(从小到大)<br /> arr3.sort(function (a, b) {<br /> return a - b;<br /> });<br /> 降序排列(从大到小)<br /> arr3.sort(function (a, b) {<br /> return b - a;<br /> });<br /> 如果指明了 compareFunction ,那么数组会按照调用该函数的返回值排序。即 a 和 b 是两个将要被比较的元素:<br /> 如果 compareFunction(a, b) 小于 0 ,那么 a 会被排列到 b 之前;<br /> 如果 compareFunction(a, b) 等于 0 , a 和 b 的相对位置不变。备注: ECMAScript 标准并不保证这一行为,而且也不是所有浏览器都会遵守(例如 Mozilla 在 2003 年之前的版本);<br /> 如果 compareFunction(a, b) 大于 0 , b 会被排列到 a 之前。<br /> compareFunction(a, b) 必须总是对相同的输入返回相同的比较结果,否则排序的结果将是不确定的。<br /> 当返回值小于0 a和b交换位置<br /> 当返回值大于等于0 a和b位置不变<br /> 当sort比较函数 返回一个小于0的值 可以实现 reverse 功能<br /> arr4.sort(function () {<br /> return -0.1;<br /> });<br /> var arr5 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 'J', 'Q', 'K'];<br /> 打乱数组(随机排序)<br /> arr5.sort(function () {<br /> return Math.random() - 0.5;<br /> });<br /> console.log(arr5);
04-数组API(3)
Array.prototype.slice();
语法: arr.slice([start,end]);<br /> 参数: start(number) 开始索引<br /> end(number) 结束索引<br /> 返回值: 新数组 包含从start 到end 范围的数组元素片段 结果是一个数组的浅拷贝<br /> 描述: 在数组中截取一个片段 包含的内容 组成一个新数组<br /> slice 的参数 允许使用负数作为参数 当参数是负数时 表示从后向前计算元素<br /> -1 表示数组中的最后一个元素 -2表示 倒数第二个元素 以此类推<br /> 选择到的结果 不包含 end 所在元素<br /> (start,end]<br /> var arr = [1, 2, 3, 4, 5, 6];<br /> var arr2 = arr.slice(2, 5);<br /> console.log(arr2);<br /> console.log(arr);<br /> var arr3 = [1, 2, 3, [4, 5, 6], 7];<br /> var arr4 = arr3.slice(1, 5);<br /> arr3[3][0] = 0;<br /> arr4[2][0] = 'ok';<br /> console.log(arr3);<br /> var arr5 = [1, 2, [3, 4], 5];<br /> var arr6 = arr5.slice(); 当slice没有参数时 默认从数组的开头获取到结尾 整个数组是一个浅拷贝<br /> console.log(arr6);<br /> console.log(arr6 === arr5);<br /> console.log(arr5[2] === arr6[2]);<br /> var arr7 = [1, 2, 3, 4, 5, 6, 7];<br /> var arr8 = arr7.slice(2, -2);<br /> console.log(arr8);<br /> var arr9 = arr7.slice(-3); 当没有end参数时 默认到数组的结尾<br /> console.log(arr9);<br /> -------------------------------------------------
Array.prototype.toString()
语法: arr.toString()<br /> 描述: toString 将数组中所有的元素都进行toString操作 (null 和 undefined 会被忽略)<br /> 使用逗号 连接toString的结果<br /> 返回值: string<br /> 推荐使用join 代替 toString<br /> var arr = [654, 3, 676, true, null, undefined, 123, 'aaa'];<br /> var str = arr.toString();<br /> console.log(str);<br /> --------------------------------------------------
Array.prototype.splice()
语法:arr.splice(start[,deleteCount,[value,...valueN]]);<br /> 参数: start(number) 开始索引<br /> deleteCount(number) 需要删除的元素数量<br /> value(any) 需要添加到 start 的元素<br /> 返回值: 新数组 包含所有被删除的元素 若没有元素被删除 则返回一个空数组
05-二维数组
二维数组
在数组中 又出现新的数组 这种情况就是二维数组<br /> 遍历二维数组<br /> for (var i = 0; i < arr.length; i++) {<br /> for (var j = 0; j < arr[i].length; j++) {<br /> console.log(arr[i][j]);<br /> }<br /> }
06-citychange
07-indexOf
Array.prorotype.indexOf()
语法: arr.indexOf(searchElement[,fromIndex=0])<br /> 参数: searchElement(any) 需要在数组中查找的元素<br /> fromIndex(number) 从指定的索引开始 默认0<br /> 返回值: index 或 -1<br /> 描述: 方法indexOf 用于在数组中查找指定元素,数组中如果有匹配的元素 则返回第一个匹配元素的索引 <br /> 没有可匹配的元素则返回-1
08-forEach
Array.prototype.forEach();
语法: arr.forEach(callback);<br /> 参数: callback(function) 回调函数<br /> 回调函数参数:<br /> [currentElement] 当前的元素<br /> [index] 当前元素的索引<br /> 描述: forEach 函数会遍历数组 给每一个数组的元素执行一个回调函数 数组中的每一个成员都会被传递进回调函数<br /> 遍历数组 -> 取代for循环
forEach 只枚举 已有的索引 它的遍历类似于 for-in<br /> arr2.forEach(function (el) {<br /> console.log(el);<br /> });
09-filter
Array.prototype.filter()
语法: arr.filter(callback);<br /> 参数: callback(function)<br /> 回调函数参数:<br /> [currentElement] 当前元素<br /> [index] 当前元素的索引<br /> 返回值: array 新数组<br /> 描述: 通过一个条件 在数组中筛选元素 符合条件的元素 会组成一个新数组返回<br /> var arr3 = arr.filter(function (el) {<br /> 在filter函数中 使用return 返回一个布尔表达式<br /> 这个布尔表达式 结果为true的情况 当前元素就会进入到新数组<br /> return el % 2;<br /> });