JS进阶笔记6持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第6天，点击查看活动详情 splic

持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第6天，点击查看活动详情

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('软件')));

持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第6天，点击查看活动详情

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