数组的方法

push

  • 作用：向数组末尾追加项（可以是一项或者多项）
  • 参数：添加的具体项（可以是一项或者多项）
  • 返回值：新数组的长度
  • 是否改变原数组：改变
  1. var ary = [1, 2, 3]; 
  2. ary.push(4); 
  3. console.log(ary); 
  4. var res = ary.push(5); 
  5. // ary.push的返回结果为新数组的长度
  6. console.log(res); // 5

unshift

  • 作用：向数组的开头追加项
  • 参数：添加的具体项（可以是一项或者多项）
  • 返回值：新数组的长度
  • 是否改变原数组：改变
  1. var ary1 = [2, 3, 5]; 
  2. ary1.unshift(1); 
  3. console.log(ary1); // [1, 2, 3, 5]
  4. var res1 = ary1.unshift(0); 
  5. console.log(res1); // 5

pop

  • 作用：删除数组末尾的项
  • 参数：无
  • 返回值：删除的末尾项
  • 是否改变原数组：改变
  1. var ary2 = [1, 2]; 
  2. ary2.pop(); 
  3. 2 // 返回值
  4. console.log(ary2); 
  5. [1] // 删除末尾项后的新数组
  6. undefined

shift

  • 作用：删除数组的开头项
  • 参数：无
  • 返回值：删除的开头项
  • 是否改变原数组：改变

splice

  • 作用：从索引n开始删除m项，并且用x进行替换
  • 参数：splice(n, m, x);
  • 返回值：返回值是一个数组，数组里边是删除的项
  • 是否改变原数组：改变
  1. var ary = [1, 2, 3, 4, 5]; 
  2. // 把索引1，2两项 替换为5，6
  3. var res = ary.splice(1, 2, 5, 6); 
  4. res; // [2, 3]
  5. ary; // [1, 5, 6, 4, 5]

只删除不替换

  1. var res1 = [1, 2, 3]; 
  2. undefined
  3. res1.splice(1, 2); 
  4. (2) [2, 3] // 删除项的数组
  5. res1; 
  6. [1] // 新数组

splice实现增加项

  1. var res2 = [0, 1, 2]; 
  2. undefined
  3. res2.splice(2, 0, 5); // 在索引2的前面删除0项，并且替换为5
  4. [] // 删除项的数组
  5. res2; 
  6. (4) [0, 1, 5, 2]

思考题！！

删除数组最后一项

  • ary.pop();
  • ary.splice(ary.length-1, 1);

  • ary.length—;

    数组的末尾追加项的三种方法

  • ary.push();

  • ary.splice(ary.length, 0, 8);
  • ary[ary.length] = 8;

slice

  • 作用：从索引n开始复制到索引m结束（不包含第m项）
  • 参数：slice(n, m)
  • 返回值：复制的新数组
  • 是否改变原数组：不改变
  • 注意：
    • 如果不写参数m ==> 从索引n开始一直复制到最后一项
    • 复制整个数组：ary.slice() 或者 ary.slice(0)
  1. var res = [1, 2, 3, 4, 5]; 
  2. undefined
  3. res.slice(1, 3); 
  4. (2) [2, 3] // 复制的新数组
  5. var res1 = slice(); 
  6. var res1 = res.slice(); 
  7. res1
  8. (5) [1, 2, 3, 4, 5]
  9. var res2 = res.slice(0); 
  10. res2; // [1, 2, 3, 4, 5]
  11. console.log(res1 == res2); // false res1和res2的空间地址不同
  12. undefined

concat（拼接数组）

  • 作用：拼接数组
  • 参数：可以是拼接的一项，或者数组
  • 返回值：拼接后的新数组
  • 是否改变原数组：不改变
  1. var ary = [1, 2, 3]; 
  2. undefined
  3. ary.concat(1); // [1, 2, 3, 1]
  4. ary // [1, 2, 3]

toString()

  • 作用：转为字符串
  • 参数：无
  • 返回值：转化为字符串的值
  • 是否改变原数组：不改变

join

  • 作用：那数组转换为字符串，并且用指定的连接符链接
  • 参数：连接符
  • 返回值：用连接符连接之后的字符串
  • 是否改变原数组：不改变
  1. var ary1 = [1, 2, 3, 4]; 
  2. undefined
  3. ary1.join("-"); 
  4. "1-2-3-4"
  5. ary1.join("+"); 
  6. "1+2+3+4"
  7. eval(ary1.join("+")); 
  8. 10

reverse

  • 作用：实现数组的倒序
  • 参数：无
  • 返回值：倒序之后的数组
  • 是否改变原数组：改变
  1. var res = [1, 2, 3, 4]; 
  2. undefined
  3. res.reverse(); 
  4. (4) [4, 3, 2, 1]
  5. res; 
  6. (4) [4, 3, 2, 1]

sort 排序

  • 作用：实现数组的排序
  • 参数：无/函数
  • 返回值：倒序之后的数组
  • 是否改变原数组：改变
  • 注意：
    • 如果不传参数，只能排10以内的；10以外的可以跟一个函数
  1. // 不传参数，排序10以内
  2. var ary = [4, 5, 8, 3, 7]; 
  3. undefined
  4. ary.sort(); 
  5. (5) [3, 4, 5, 7, 8]
  6. // 参数为函数时，可以排序任意数值
  7. var ary1 = [11, 2, 5, 9, 7, 55, 5, 1]; 
  8. undefined
  9. ary1.sort(function (a, b) {return a-b; }); //a-b 升序
  10. (8) [1, 2, 5, 5, 7, 9, 11, 55]
  11. ary1.sort(function (a, b) {return b-a; }); // b-a 降序
  12. (8) [55, 11, 9, 7, 5, 5, 2, 1]

indexOf

  • 作用：检索某项在数组中首次出现的位置(索引)
  • 参数：index(n, m)
    • n：检索的项
    • m：从哪开始检索
  • 返回值：索引/-1
  • 是否该变原数组：不改变
  • 注意：
    • 如果数组中不包含那项，返回值为-1；通过这个可以判断数组中是否包含某项
  1. var ary = [1, 5, 6, 8, 4, 8, 1, 0, 5]; 
  2. undefined
  3. ary.indexOf(1); 
  4. 0 // 1首次在索引0处出现
  5. ary.indexOf(7); 
  6. -1 // 7不在数组中
  7. ary.indexOf(1, 0); 
  8. 0 // 从索引0处开始检索首次出现1的索引值
  9. ary.indexOf(1, 1); 
  10. 6 // 从索引1处开始检索首次出现1的索引值

lastIndexOf

  • 作用：检索某项在数组中最后出现的位置(索引)
  • 参数：index(n, m)
    • n：检索的项
    • m：到哪结束检索（包含最后一项）
  • 返回值：索引/-1
  • 是否该变原数组：不改变
  • 注意：
    • 如果数组中不包含那项，返回值为-1
  1. var ary3 = [1, 5, 6, 8, 4, 8, 1, 0, 5]; 
  2. undefined
  3. ary3.lastIndexOf(1); 
  4. 6
  5. ary3.lastIndexOf(1, 6); // 到索引为6的值时结束检索（包含最后一项）
  6. 6
  7. ary3.lastIndexOf(1, 5); 
  8. 0

includes

  • 作用：检测数组是否包含某项
  • 参数：检测的项
  • 返回值：布尔值
  • 是否改变原数组：不改变

forEach

  • 作用：遍历数组中的每一项
  • 参数：函数(item, index) item是每一项的值 index是每一项的索引
  • 返回值：undefined
  • 是否改变原数组：不改变
  1. var ary = [1, 5, 6, 8, 4, 8, 1, 0, 5]; 
  2. undefined
  3. ary.forEach(function(item, index){console.log(item+" ---"+index)}); 
  4. VM237:1 1 ---0
  5. VM237:1 5 ---1
  6. VM237:1 6 ---2
  7. VM237:1 8 ---3
  8. VM237:1 4 ---4
  9. VM237:1 8 ---5
  10. VM237:1 1 ---6
  11. VM237:1 0 ---7
  12. VM237:1 5 ---8
  13. undefined  // 返回值undefined （因为没有return ，默认return undefined；）

map

  • 作用：把一个数组映射成一个新的数组
  • 参数：函数
  • 返回值：映射后的新数组
  • 是否改变原数组：否
  1. // map映射
  2. var ary3 = [1, 2, 3, 4, 5, 6];
  3. var res = ary3.map(function (item,index) {
  4.     return `<li>${item}nizhenbang!!</li>`;
  5. })
  6. console.log(res);

数组去重！！

1、双for循环去重

  • 原理：依次拿出数组中的每一项，和他后面的所有剩余项进行比较，如果有相同数字就删除
  1. function unique(ary5) {
  3.     for (i=0;i<ary5.length-1;i++) {
  4.         var getItem = ary5[i];
  5.         for (j=i+1;j<ary5.length;j++) {
  6.             if(getItem == ary5[j]) {
  7.                 ary5.splice(j,1);
  8.                 // 删除一项后，（数组会发生变化）数组的每一项对应索引会变化，所以索引--，以对应删除重复项后的新数组
  9.                 j--;
  10.             }
  11.         }
  12.     }
  13.     return ary5;
  15. }
  16. var ary5 = [1, 1, 1, 2, 2, 23, 3, 35, 4, 5, 5, 4]; 
  17. var res = unique(ary5); 
  18. console.log(res);

2、利用对象进行数组去重

  • 原理：首先创建一个空对象，去遍历数组中的每一项，把数组的每项作为对象的属性名和属性值，給此对象添加；添加的过程中，如果对象中已经包含此项，说明重复，则在数组中删除此项。
  1. // 2、利用对象去重
  2. function unique2(ary6) {
  4.     // 首先创建一个空对象
  5.     var obj = {};
  6.     for (i=0;i<ary6.length;i++) {
  7.         var item = ary6[i];
  8.         // 判断对象中是否已经包含此项
  9.         if (obj[item] == item) {
  10.             ary6.splice(i,1);
  11.             i--;
  12.             // 结束本次循环，继续下一次循环
  13.             continue;
  14.         }
  15.         // 数组中的某一项添加到对象中
  16.         // 数组中的某一项当成属性名和属性值
  17.         obj[item]=item;
  18.     }
  19.     return ary6;
  21. }
  22. var ary6 = [1, 2, 3, 3, 3, 5, 5, 8, 9, 9, 9, 10, 10]; 
  23. var res = unique2(ary6); 
  24. console.log(res);

3、利用新数组去重

  1. function unique3(ary) {
  3.     var newAry7 = [];
  4.     for (i=0;i<ary.length;i++) {
  5.         /* // 如果新数组中不包含此项，就給新数组push
  6.         if (newAry7.indexOf(ary[i]) == -1) {
  7.             newAry7.push(ary[i]);
  8.         } */
  9.         // 如果新数字中包含此项，结束本次循环，继续下一次循环
  10.         if (newAry7.indexOf(ary[i]) > -1) {
  11.             continue;
  12.         }
  13.         newAry7.push(ary[i]);
  14.     }
  15.     return newAry7;
  17. }
  18. var ary7 = [1, 1, 1, 1, 1, 5, 8, 47, 8]; 
  19. var res7 = unique3(ary7); 
  20. console.log(res7);