加入收藏 | 设为首页 | 会员中心 | 我要投稿 核心网 (https://www.hxwgxz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 建站 > 正文

14 个拷贝数组的 JS 技巧

发布时间:2019-11-14 12:49:59 所属栏目:建站 来源:佚名
导读:【线上直播】11月21日晚8点贝壳技术总监侯圣文《数据安全之数据库安全黄金法则》 数组拷贝经常被误解,但这并不是因为拷贝过程本身,而是因为缺乏对 JS 如何处理数组及其元素的理解。JS 中的数组是可变的,这说明在创建数组之后还可以修改数组的内容。 这意

技巧 7 - 使用解构

  1. const numbers = [1, 2, 3, 4, 5]; 
  2.  
  3. const [...copy] = numbers; 
  4. copy.push(6); // 添加新项以证明不会修改原始数组 
  5.  
  6. console.log(copy); 
  7. console.log(numbers); 
  8.  
  9. // 输出 
  10. // [1, 2, 3, 4, 5, 6] 
  11. // [1, 2, 3, 4, 5] 

技巧 8 - 使用 Array.concat 方法

  1. const numbers = [1, 2, 3, 4, 5]; 
  2.  
  3. const copy = numbers.concat(); 
  4. copy.push(6); // 添加新项以证明不会修改原始数组 
  5.  
  6. console.log(copy); 
  7. console.log(numbers); 
  8.  
  9. // 输出 
  10. // [1, 2, 3, 4, 5, 6] 
  11. // [1, 2, 3, 4, 5] 

技巧 9 - 使用 `Array.push` 方法和展开操作符

  1. const numbers = [1, 2, 3, 4, 5]; 
  2.  
  3. let copy = []; 
  4. copy.push(...numbers); 
  5. copy.push(6); // 添加新项以证明不会修改原始数组 
  6.  
  7. console.log(copy); 
  8. console.log(numbers); 
  9.  
  10. // 输出 
  11. // [1, 2, 3, 4, 5, 6] 
  12. // [1, 2, 3, 4, 5] 

技巧 10 - 使用 `Array.unshift ` 方法和展开操作符

  1. const numbers = [1, 2, 3, 4, 5]; 
  2.  
  3. let copy = []; 
  4. copy.unshift(...numbers); 
  5. copy.push(6); // 添加新项以证明不会修改原始数组 
  6.  
  7. console.log(copy); 
  8. console.log(numbers); 
  9.  
  10. // 输出 
  11. // [1, 2, 3, 4, 5, 6] 
  12. // [1, 2, 3, 4, 5] 

技巧 11 - 使用 `Array.forEach` 方法和展开操作符

  1. const numbers = [1, 2, 3, 4, 5]; 
  2.  
  3. let copy = []; 
  4. numbers.forEach((value) => copy.push(value)); 
  5. copy.push(6); // 添加新项以证明不会修改原始数组 
  6.  
  7. console.log(copy); 
  8. console.log(numbers); 
  9.  
  10. // 输出 
  11. // [1, 2, 3, 4, 5, 6] 
  12. // [1, 2, 3, 4, 5] 

技巧 12 - 使用 `for` 循环

  1. const numbers = [1, 2, 3, 4, 5];let copy = [];for (let i = 0; i < numbers.length; i++) { 
  2.  copy.push(numbers[i]); 
  3. copy.push(6); // 添加新项以证明不会修改原始数组 
  4.  
  5. console.log(copy); 
  6. console.log(numbers); 
  7.  
  8. // 输出 
  9. // [1, 2, 3, 4, 5, 6] 
  10. // [1, 2, 3, 4, 5] 

技巧 13 - 使用 `Array.reduce` 方法

这个做法是可行,但比较多余,少用

  1. const numbers = [1, 2, 3, 4, 5]; 
  2.  
  3. const copy = numbers.reduce((acc, x) => { acc.push(x); return acc; }, []); 
  4. copy.push(6); // 添加新项以证明不会修改原始数组 
  5.  
  6. console.log(copy); 
  7. console.log(numbers); 
  8.  
  9. // 输出 
  10. // [1, 2, 3, 4, 5, 6] 
  11. // [1, 2, 3, 4, 5] 

技巧 14 - 使用古老的 `apply` 方法

(编辑:核心网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读