arr.push(...items) —— 从尾端添加元素,
arr.pop() —— 从尾端提取元素,
arr.shift() —— 从首端提取元素,
arr.unshift(...items) —— 从首端添加元素。
1、删除数组
数组是对象,所以可以使用delete
let arr = ['dd', 'go', 'home']
delete arr[1]
console.log(arr, arr[1]) // ["dd", '', "home"] undefined
delete obj.key 是通过 key 来移除对应的值。对于对象来说是可以的。但是对于数组来说,我们通常希望剩下的元素能够移动并占据被释放的位置。我们希望得到一个更短的数组。
2、splice它可以做所有事情,添加、删除、插入元素
语法:splice(start,[deleteNum, elem1....elemN])
它从索引start开始修改数组,删除deleteNum个元素并在当前位置插入elem1....elemN
let arr = ["I", "study", "JavaScript"];
arr.splice(1,1);// 从索引 1 开始删除 1 个元素
alert( arr ) // ["I", "JavaScript"]
let arr = ["I","study","JavaScript", "right", "now"];
arr.splice(0, 3, "Let's", "dance");
alert( arr ) // ["Let's", "dance", "right", "now"]
let arr = ["I", "study", "JavaScript"];
// 从索引 2 开始, 删除 0 个元素,然后插入 "complex" 和 "language"
arr.splice(2, 0, "complex", "language");
alert( arr ); // "I", "study", "complex", "language", "JavaScript"
3、arr.slice([start], [end])
let arr = ["t", "e", "s", "t"];
alert( arr.slice(1, 3) ); // e,s(复制从位置 1 到位置 3 的元素)
alert( arr.slice(-2) ); // s,t(复制从位置 -2 到尾端的元素)
4、concat数组合并
5、数组搜索
arr.indexOf(item, from) 从索引 from 开始搜索 item,如果找到则返回索引,否则返回 -1。
arr.lastIndexOf(item, from) —— 和上面相同,只是从右向左搜索。
arr.includes(item, from) —— 从索引 from 开始搜索 item,如果找到则返回 true(译注:如果没找到,则返回 false)。
let arr = [1, 0, false];
alert( arr.indexOf(0) ); // 1
alert( arr.indexOf(false) ); // 2
alert( arr.indexOf(null) ); // -1
alert( arr.includes(1) ); // true
请注意,这些方法使用的是严格相等 === 比较。所以如果我们搜索 false,会精确到的确是 false 而不是数字 0。
如果我们想检查是否包含某个元素,并且不想知道确切的索引,那么 arr.includes 是首选。
此外,includes 的一个非常小的差别是它能正确处理NaN,而不像 indexOf/lastIndexOf:
const arr = [NaN];
alert( arr.indexOf(NaN) ); // -1(应该为 0,但是严格相等 === equality 对 NaN 无效)
alert( arr.includes(NaN) );// true(这个结果是对的)
find 和 findIndex
let result = arr.find(function(item,index,array) {
// 如果返回 true,则返回 item 并停止迭代
// 对于假值(falsy)的情况,则返回 undefined
});
如果它返回 true,则搜索停止,并返回 item。如果没有搜索到,则返回 undefined
arr.findIndex 方法(与 arr.find 方法)基本上是一样的,但它返回找到元素的索引,而不是元素本身。并且在未找到任何内容时返回 -1。
6、sort
let arr = [ 1, 2, 15 ];
arr.sort(function(a,b) { return a - b; });
alert(arr); //1, 2, 15
7、arr.reverse 方法用于颠倒 arr 中元素的顺序。
let arr = [1, 2, 3, 4, 5];
arr.reverse();
alert( arr ); // 5,4,3,2,1
8、split和join
let str = "test";
alert( str.split('') ); // t,e,s,t 字符串拆为字母数组
let arr = ['Bilbo', 'Gandalf', 'Nazgul'];
let str = arr.join(';'); // 使用分号 ; 将数组粘合成字符串
alert( str ); // Bilbo;Gandalf;Nazgul
9、reduce/reduceRight 它们用于根据数组计算单个值。
let value = arr.reduce(function(accumulator,item,index,array) {
// ...
}, [initial]);
accumulator —— 是上一个函数调用的结果,第一次等于 initial(如果提供了 initial 的话)。
item —— 当前的数组元素。
index —— 当前索引。
arr —— 数组本身。
initial —— 初始值
应用函数时,上一个函数调用的结果将作为第一个参数传递给下一个函数。
因此,第一个参数本质上是累加器,用于存储所有先前执行的组合结果。最后,它成为 reduce 的结果。
let arr = [1, 2, 3, 4, 5];
let result = arr.reduce((sum,current) => sum + current, 0);
alert(result); // 15
arr.reduceRight 和 arr.reduce 方法的功能一样,只是遍历为从右到左。
let arr = [];
// Error: Reduce of empty array with no initial value
// 如果初始值存在,则 reduce 将为空 arr 返回它(即这个初始值)。
arr.reduce((sum, current) => sum + current, 10);
所以建议始终指定初始值。
10、Array.isArray
数组是基于对象的,不构成单独的语言类型。
所以 typeof 不能帮助从数组中区分出普通对象
alert(typeof {}); // object
alert(typeof []); // object
alert(Array.isArray({})); // false
alert(Array.isArray([])); // true
11、function camelize(str) {
return str.split('-').map((item, index) => {
return index === 0 ? item : item[0].toUpperCase()+item.slice(1)
}).join('')
}
console.log(camelize('background-color')) // backgroundColor
console.log(camelize('list-style-image')) // listStyleImage
console.log(camelize('-webkit-transition')) // WebkitTransition
12、类数组array-like有索引和length属性的对象,所以看起来很像数组
let arrayLike = {
// 有索引和 length 属性 => 类数组对象
0: "Hello",
1: "World",
length: 2
};
// Error (no Symbol.iterator)
for(letitemofarrayLike){}
可迭代对象和类数组对象通常都 不是数组,它们没有 push 和 pop 等方法。
13、Array.from
有一个全局方法 Array.from 可以接受一个可迭代或类数组的值,并从中获取一个“真正的”数组。然后我们就可以对其调用数组方法了。
let arrayLike = {
0: "Hello",
1: "World",
length: 2};
let arr = Array.from(arrayLike);// (*)
alert(arr.pop()); // World(pop 方法有效)
console.log(arr) // ['Hello', 'World']
let str = 'xy';// 将 str 拆分为字符数组
let chars = Array.from(str);
alert(chars[0]); // x
alert(chars[1]); // y
alert(chars.length); // 2
Array.from与split方法不同,它依赖于字符串的可迭代性,因此就i像for...of一样,可以正确的处理代理对。
其实Array.from就跟下面一些代码做着同样的事:
let str = 'xy'
let chars = []
for (let char of str) {
chars.push(char)
}
console.log(chars) // ['x','y']
14、可以应用 for..of 的对象被称为 可迭代的,Symbol.iterator 方法会被 for..of 自动调用,但我们也可以直接调用它。