- splice(index, count[, e1, ..., en): 在数组中删除、替换或添加元素
- 删除元素:只提供index和count两个参数,删除从index位置开始的count个元素,并返回删除的元素数组
let a = [1, 2, 3, 4, 5]; let e = a.splice(2, 1); // 从索引为2的位置开始,删除1个元素 console.log(e); // (1) [3],被删除元素组成的数组 console.log(a); // (4) [1, 2, 4, 5],改变后的数组
- 替换元素:提供三个以上参数,前两个参数的作用与1相同,在1删除的基础上,第三个及之后的参数被插入到index位置,返回值与1相同
let a2 = [1, 2, 3, 4, 5]; // 从索引为2的位置开始,删除2个元素,并将元素10播放到索引为2的位置 let e2 = a2.splice(2, 2, 10); console.log(e2); // (2) [3, 4] console.log(a2); // (4) [1, 2, 10, 5] a2.splice(1, 1, 6); // a2[1] = 6 console.log(a2); // (4) [1, 6, 10, 5 ]
- 添加元素:提供三个以上参数,第二个count参数值为0,此时不删除元素,只在index位置插入第三个及之后的参数,返回值为空数组
let a3 = [1, 2, 3, 4, 5]; // 从索引为2的位置开始,删除0个元素,并将元素10播放到索引为2的位置 let e3 = a3.splice(2, 0, 10); console.log(e3); // [] console.log(a3); // (6) [1, 2, 10, 3, 4, 5]
- sort()或sort(compareFunction):对数组元素排序
- 不提供参数时,按字典顺序(Unicode从小到大)排序
- 提供compareFunction时,如compareFunction返回正值则交换元素
let a = [50, 6, 200, 3, 7, 80]; // 按字典排序 console.log(a.sort()); // (6) [200, 3, 50, 6, 7, 80] // 当v1 - v2为正值时交换元素 console.log(a.sort((v1, v2) => v1 - v2)); // (6) [3, 6, 7, 50, 80, 200] console.log(a.sort((v1, v2) => v2 - v1)); // (6) [200, 80, 50, 7, 6, 3]
- forEach(function(currentValue[, index[, array]])[, thisArg]): 对数组中的每个元素执行一次回调函数
let a = ["软测181", "软测182", "软件181", "软件182", "软件183"]; let eUl = document.createElement('ul'); a.forEach((c) => { let eLi = document.createElement('li') eLi.textContent = c; eUl.appendChild(eLi); console.log(this); // window }); document.body.appendChild(eUl);
- filter(function(currentValue[, index[, array]])[, thisArg]): 对所有元素依次应用回调函数,返回一个新数组,包含所有回调函数返回true的元素
let a = ['软件181', '软件182', '软件183', '软测181', '软测181']; // 包含所有“软件”开始的元素,输出 (3) ["软件181", "软件182", "软件183"] console.log(a.filter(item => item.startsWith('软件')));
- map生成一个新的数组,其中的元素为指定数组中的元素应用回调函数返回值、
let a = ["软测181", "软测182", "软件181", "软件182", "软件183"]; // 生成一个新数组,元素为li元素 let aLi = a.map(item => { let eLi = document.createElement('li'); eLi.textContent = item; return eLi; }); let eUl = document.createElement('ul'); aLi.forEach(item => eUl.appendChild(item)); document.body.appendChild(eUl);
- reduce(function(previousResult, currentValue[, index[, array]])[, initialValue]):使用回调函数对数组中的每个元素进行处理,并将处理结果汇总返回,其中:
- previousResult: 必须提供,上一次执行的结果,第一次执行时,如提供initialValue参数,则previousResult的值为initialValue,否则previousResult的值为数组中的第一个元素, 且currentValue为数组中的第二个元素
- currentValue:必须提供,当前正在处理的元素
function sum(...numbers) { return numbers.reduce((prev, curr) => prev + curr, 0) } console.log(sum(1, 2, 3)); // 6 console.log(sum(10, 5, 100, 20)); // 135
三、DOM&BOM
阿里云盘:JavaScript-DOM.pdf