array.push 数组后面增加
array.unshift 数组前面增加
array.indexof(0) 判断数组中值的下标
array.concat 数组后面添加多个值
array.includes()//返回 true false 可以判断数组包涵某一个的值
array.trim() 去除空格
array.join(“sep) 数组拼接字符串
array.sort() 升序(降序)
array.reduce() 求和算法
array.reverse() 翻转数组

1-1. 增加

1-1-1. push( ) 从尾部添加

特点：1.可以添加一个值，也可以添加多个

  1.     <script>
  2.       /*
  3.        *使用场景：加载更多    
  4.       */
  5.         var arr = [1,2,3];
  6.         arr.push(4);
  7.         arr.push(5,6);
  8.         arr.push([7,8,9]);
  9.         console.log(arr);
  10.         var arr1 = [1,2,3,4,5,6];
  11.         arr.push(arr1);
  12.     </script>

3.数组 - 图2

1-1-2. unshift( ) 从前添加

特点：1.可以添加一个值，也可以添加多个

  1. /*
  2.     使用场景：历史场景
  3. */
  4.     <script>
  5.         var arr = [1,2,3];
  6.         arr.unshift(0);
  7.         arr.unshift(-1);
  8.         var arr1 = [-4,-3,-2];
  9.         arr.unshift(arr1);
  10.         console.log(arr);
  11.     </script>

3.数组 - 图3

1-1-3. concat( ) 连接两个数组 (不改变原数组的内容)

  1. var arr = [1,2,3];
  2. var b = [4,5,6];
  3. var c = arr.concat(b);
  5. console.log(arr);  // [1,2,3]
  6. console.log(c);    // [1,2,3,4,5,6]

1-2. 删除

array.pop 从数组后面删除
array.shift 从数组前面删除
array.splice(index,删除多少个) 两个参数

1-2-1. pop( ) 从尾部删除

  1. var arr = [1,2,3,4]
  2. arr.pop()
  3. console.log(arr) // [1,2,3]

1-2-2. shift( ) 从头部删除

  1. var arr = [1,2,3,4]
  2. arr.shift()
  3. console.log(arr); // [2,3,4]

1-2-3. splice(startIndex，长度） 定点删除

  1. var arr = [1,2,3,4,5];
  2. arr.splice(2,1);
  3. console.log(arr);    //[1,2,4,5]

1-3. 修改

array.splice(index,删除多少个,替换的值) 三个参数 
  1. /**
  2.   * splice(index,howmany,value)
  3.   * index    下标
  4.   * howmany      删除多少个
  5.   * value        替代的值
  6. */
  7. var arr = ['html','css','js'];
  8. arr.splice(1,1,'vue');
  9. console.log(arr);   //['html','vue','js']

1-3-1. splice(startIndex，长度，元素…) 修改 先删除后插入

从某个下标前面添加值

array.splice(index,0,添加的值) 三个参数 在第几个下标前面添加

截取

slice(开始的下标,结束的下标) 不包含结束的下标

1-4. 查询

1-4-1. indexOf(value) 查询对应值的下标

  1. var arr=[1,2,3,4];
  2. console.log(arr.indexOf(1)); // 0
  3. //如果没有对应的值,则返回-1

1-4-1. includes(值) 查询对应的值

  1.  var arr=[4,5,6];
  2.       console.log(arr.includes(5));
  3.       //可以判断数组是否包涵某个值

1-4-2. slice(startIndex,endIndex) 截取 (包含开始下标，不含结束下标)

  1. // slice(startIndex,endIndex) 截取 包含开始不含结束
  2. // slice(startIndex) 截取从startIndex开始到后面的所有值
  3. var arr = [1, 2, 3, 4, 5, 6]
  4. console.log(arr.slice(1, 3));  // [2,3]
  5. console.log(arr.slice(1)); // [2,3,4,5,6]

其他

trim()去除字符串前后尾空格

  1.         var str = '                qwer ';
  2.         console.log(str.trim());        //qwer

jion() 可以将数组拼接字符串

  1.     <script>
  2. //join(sep) 可以将数组拼接字符串
  3.      var arr=["html","css","js"];
  5.      console.log( arr.join(","));
  6.     </script>

image.png

sort 对数组进行升序(降序)排序

升序

  1.   var arr=[23,5,45,32,45,2];
  3.   var newArr=arr.sort(function(a,b){
  4.       return a-b;
  5.   })


降序

  1.   var arr=[23,5,45,32,45,2];
  3.   var newArr=arr.sort(function(a,b){
  4.       return b-a;
  5.   })

array.reduce()求和

  1.  var arr=[1,2,3];
  2.  var sum=arr.reduce((a,b)=>a+b)

array.reverse() 翻转

  1.  var arr=["html","css","js"]
  3.  console.log(arr.reverse());

实例

  1.         /**
  2.          * 给定数组 把年龄大于16岁赋值给新数组
  3.         */
  4.         var arr = [
  5.             { name: '张三', age: '20岁' },
  6.             { name: '李四', age: '18岁' },
  7.             { name: '王五', age: '12岁' },
  8.             { name: '路人甲', age: '6岁' },
  9.             { name: '路人乙', age: '28岁' }
  10.         ]
  11.         var test = [];
  12.         for (var i = 0; i < arr.length; i++) {
  13.             if (parseInt(arr[i].age) > 16) {
  14.                 test.push(arr[i]);
  15.             }
  16.         }
  17.         console.log(test);

image.png

  1.  var arr=[
  2.          {name:"lisi",age:"12px"},
  3.          {name:"wangwu",age:"13px"},
  4.          {name:"zhaoliu",age:"14px"},
  5.       ]
  6.      var text=[];
  7.     for(var i=0;i<arr.length;i++){
  8.         var age=parseInt(arr[i].age)*2;
  9.          arr[i].age=age;
  10.          if(age>24){
  11.             arr[i].like=true;
  12.          }else{
  13.             arr[i].like=false;
  14.          }
  16.         text.push(arr[i]);
  17.           console.log(age);
  20.     }
  22. console.log(text);

image.png

  1.     /**
  2.      *  根据输入框查询
  3.     */
  4.         <input type="text" name="" id="ipt">
  5.     <script>
  6.         /**
  7.          * 
  8.         */
  9.         var searchs = [
  10.             {
  11.                 spell: 'A',
  12.                 citys: [
  13.                     { name: '阿里', id: 1001 },
  14.                     { name: '阿克', id: 1002 },
  15.                     { name: '阿云', id: 1003 }
  16.                 ]
  17.             },
  18.             {
  19.                 spell: 'T',
  20.                 citys: [
  21.                     { name: '天理', id: 2001 },
  22.                     { name: '天选', id: 2002 },
  23.                     { name: '天云', id: 2003 }
  24.                 ]
  25.             }
  26.         ]
  27.         var arr = [];
  28.         var ipt = document.querySelector('#ipt');
  29.         ipt.onkeydown = function (e) {
  30.             if (e.keyCode == 13) {
  31.                 if (this.value != '') {
  32.                     arr.splice(0,arr.length);
  33.                     var keyword = this.value.trim();
  34.                     searchCity(arr, keyword);
  35.                     this.value = '';
  36.                     if (arr != '') {
  37.                         console.log(arr);
  38.                     } else {
  39.                         console.log('无');
  40.                     }
  41.                 }else{
  42.                     alert('字符不能为空');
  43.                 }
  44.             }
  45.         }
  47.         function searchCity(arr, keyword) {
  48.             for (var i = 0; i < searchs.length; i++) {
  49.                 // console.log(searchs[i].citys);
  50.                 var citys = searchs[i].citys;
  51.                 for (var j = 0; j < citys.length; j++) {
  52.                     // console.log(searchs[i].citys[j]);
  53.                     if (citys[j].name.includes(keyword)) {
  54.                         arr.push(citys[j]);
  55.                     }
  56.                 }
  57.             }
  58.         }
  59.     </script>

forEach()
map()
some() 只要数组中有一项满足条件 返回值为boolean
every() 数组的每一项，都必须满足某个条件 返回值为boolean
filter( ) 只要是达到某个条件，就会返回一个新的数组
find() 返回数组中满足条件的某个值
findindex() 返回数组中满足某个条件值的下标

  1.  var test=[2,3,4];                                                   forEach()
  2. var arr=[]
  3.  test.forEach(function(item){
  4.       item=item*2;
  5.       arr.push(item);
  6.  })
  1. var arr=[3,4,5,6];                                                  some()
  2.     //只要数组中有一项满足条件 就返回true
  3.     var res= arr.some(item=>item>1)
  4.       console.log(res);       //true
  1. var arr=[2,3,4];                                                    every()
  3.           var res= arr.every(items=>items>3)
  5.           console.log(res);         //false
  1. var arr=[3,4,5,6]                                                          filter()
  2.       var res=arr.filter(items=>items>4);
  3.       console.log(res);            //[5,6    ]
  1.     //find 返回数组中满足条件的某个值
  2.    var arr= [2,3,4]                                                        find()
  3.   var res= arr.find(item=>item==3)   
  4.   console.log(res);                //3
  1.    var arr=[2,3,4]                                                     findindex()
  2.    var index=arr.findIndex(item=>item==4)
  3. console.log(index);        //2

二位数组求和

  1.     var arr=[[2,3,4],[10,11,12],[20,10,20]];
  2.    var list=[]
  4. var sum=0;
  5.     for(var i=0;i<arr.length;i++){
  6.         for(var j=0;j<arr[i].length;j++){
  7.             sum+=arr[i][j]
  8.             //console.log();
  9.         }
  10.         console.log(sum);
  11.              list.push(sum);
  12.     }
  15. console.log(list.toString());