zoukankan      html  css  js  c++  java
  • js基础总结03 --操作数组

    修改于 2019-11-10

    1 length:长度

    <script>
     var arr = [1,2,3,4,5,6,7,8];
        console.log(arr.length);//arr.length = 8;
        arr.length = 5;//给定数组长度;
        console.log(arr);//arr = [1,2,3,4,5];
        delete arr[2];//删除arr[2],数组长度不变;
        console.log(arr);//arr = [1, 2, empty, 4, 5];
        console.log(typeof(arr[2]));//undefined;
        console.log(arr.length);
    </script>

    2 pop,push:方法,把数组相当于一个栈

    push(x):向数组尾部压入x,并返回新数组的长度

    pop():从尾部弹出一个元素,并返回弹出的元素

      <script>
        var arr = [1,2,3,4,5];
        var number = arr.push(7);//arr.push(9) 相当于 arr[arr.length] = 7;
        console.log(arr);//arr = [1,2,3,4,5,7]
        console.log(number);//6
        var num = arr.pop();
        console.log(arr);// arr = [1,2,3,4,5]
        console.log(num);//7
      </script>

    3 unshift 和 shift 方法,把数组相当于一个队列

    unshift(x):向数组头部插入x,并返回数组长度

    shift():从头部弹出一个元素,并返回弹出的元素

      <script>
        var arr = [1,2,3,4,5];
        var number = arr.unshift(9);
        console.log(arr);// arr = [9,1,2,3,4,5];
        console.log(number);// 6
        var num = arr.shift();
        console.log(arr);// arr = [1,2,3,4,5];
        console.log(num);//9
      </script>

    4 slice 和 splice 方法

    slice(x,y):返回数组[x,y),索引位置的片段,左从0开始,右从-1开始,不影响原数组

    splice(x,y,[.....]):x:删除的起始位置,y删除的个数(没有y的话,删除起始点开始所有),[...]为要插入数组的所有参数;splice方法改变原数组

     <script>
        var arr = [1,2,3,4,5];
        console.log(arr.slice(1,3));//[2, 3]
        console.log(arr);// [1,2,3,4,5]
        console.log(arr.slice(1));//[2, 3, 4, 5]
        console.log(arr.length);//5
        console.log(arr.slice(0,-1));//[1, 2, 3, 4]
        var arr1 = [1,2,3,4,5,6];
        console.log(arr1.splice(1,2));//[2, 3]
        console.log(arr1);//[1, 4, 5, 6]
        console.log(arr1.splice(0));//[1, 4, 5, 6]
        console.log(arr1);//[]
        arr1 = [1,6]
        console.log(arr1.splice(0,1,1,2,3,'4','5'));//[1]
        console.log(arr1);//[1, 2, 3, "4", "5", 6]
      </script>

    5 join 方法,把数组变为一个字符串(用指定分割符划分)//相反于string.split()方法,它把字符串变为数组

    join("x"):将一个数组用x分割符生成一个字符串,join()默认分割符为",",不改变原数组;

    <script>
        var arr = [1,2,3,4,5];
        console.log(arr.join());//1,2,3,4,5
        console.log(typeof(arr.join()));//string
        console.log(arr.join("-"));//1-2-3-4-5
        console.log(arr.join(""));//12345
        console.log(arr);//[1,2,3,4,5]
    </script>

    6 sort 和 reverse 方法

    reverse():在原数组操作,并把元素颠倒,改变原数组

    sort(x):不传x:对原数组按字母表顺序排列,undefined排在最后;传x:x一般为一个比较函数,用比较函数的返回值来判定排序,改变原数组

    <script>
        var arr = [1,3,2,4,5];
        console.log(arr.reverse());//[5, 4, 2, 3, 1]
        console.log(arr);//改变原数组,arr = [5, 4, 2, 3, 1]
        var arr1 = [4,3,2,undefined,1];
        console.log(arr1.sort());//[1, 2, 3, 4, undefined]
        console.log(arr1);//arr = [1, 2, 3, 4, undefined]
        var arr2 = [11,13,12];
        function flag(a,b){return a-b};//function(a,b);a为i+1,b为i;当要比较的时候,从中间开始比较
        console.log(arr2.sort(flag));//逆序排列,arr2 = [13, 12, 11];
    </script>

     7 concat 方法

    arr.concat(x): 将数组arr中的元素和参数x进行连接并返回连接后的数组,不会影响原先的arr数组

      <script>
        var arr = [1,2,3,4,5];
        console.log(arr.concat(1,'2',3,[4,5],[6,[7,8]]));//[1,2,3,4,5,1,'2',3,4,5,6,[7,8]]
        console.log(arr);//[1,2,3,4,5]
      </script>

    8 Array.from()方法

    将类数组和可遍历的对象变成真正的数组

      <script>
        var oLi = document.querySelectorAll('li');
        console.log(typeof(oLi));//object
        console.log(Array.from(oLi));//Array(3) [ li, li, li ]
      </script>

    9 ...rest参数的逆运算,将数组变成参数列

    console.log(...[1,2,3,4]); //1 2 3 4

    10 find()和findIndex()

    查找值或位置,参数为一个判断函数

      <script>
        var arr =new Array(1,2,3,4,5,6);
        console.log(arr.find((i) => { return i==2}))//2
        console.log(arr.findIndex((i) => { return i==2}))//1
      </script>

    11 entries() , keys() ,values()对数组返回名字相对应的可遍历对象

      <script>
        var arr =new Array(1,2,3,4,5,6); 
        console.log([...arr.entries()]);//键值对Array(6) [ (2) […], (2) […], (2) […], (2) […], (2) […], (2) […] ]
        console.log([...arr.keys()]);//键 Array(6) [ 0, 1, 2, 3, 4, 5 ]
        console.log([...arr.values()]);//值 Array(6) [ 1, 2, 3, 4, 5, 6 ]
     </script>

    12 for in 和 for of

      <script>
        var arr =new Array(1,2,3,4,5,6); 
        for(i in arr){//遍历键
          console.log(i);
        }//0,1,2,3,4,5
        for(i of arr){//遍历值
          console.log(i);
        }//1,2,3,4,5,6
      </script>

    13 forEach(function(item,index,array)) 遍历处理函数

      <script>
        var arr =new Array(1,2,3,4,5,6); 
        arr.forEach((i) => {console.log(i)});//1,2,3,4,5,6
      </script>
  • 相关阅读:
    pycharm使用小技巧
    多线程的异常处理
    零星
    python的多线程 ThreadPoolExecutor
    零星
    python的轮询timer 和js的轮询setInterval
    fcitx 输入框纵向
    Gvim配置
    窗口,父窗口parentwindow,所有者窗口ownerwindow
    Request对象 --web浏览器向web服务端的请求
  • 原文地址:https://www.cnblogs.com/Zxq-zn/p/11469824.html
Copyright © 2011-2022 走看看