资讯详情

ES5与ES6中的数组方法

ES5:

数组方法:

ES6:

数组创建:

数组扩展方法:

扩展运算符: ...


ES5:

数组方法:

  1. join():该方法不改变原数组
    语法:arr.join(separator)  参数:separator:      指定一个字符串用来分隔数组的每个元素,      如果指定为空字符串,则分隔元素之间没有字符  返回值:返回一个字符串(数组的所有元素都转换成单独的字符串,如果数组是空数组,则返回空字符串       let arr1 = [],         arr2 = [1,3,5,'ssfs'];     console.log(arr1.join(""));    // 空字符串     console.log(arr2.join(""));    // 135ssfs      console.log(arr1.join("_"));  ///空字符串     console.log(arr2.join("s*n"));//1s*n3s*n5s*nssfs     console.log(arr2.join("-"));  //1-3-5-ssfs  注:当数组元素转换字符串时,这些特例:      null和undefined它将转换为空字符串,对象将转换为空字符串[object,Object]      let fn = function(){return 1;},         arr3 = [{a:[2,3],null,undefined,true,false,fn]     console.log(arr3.join(" "));  //[object Object] 2,3   true false function(){return 1;}
  2. concat():该方法不改变原数组
    功能:拼接数组          // 拼接:concat() 方法用于合并两个或多个数组,不改原数组,而是返回一个新数组。          let arr5 = [1,2,3,0], arr6 = 二,三d'];         console.log(arr5.concat(arr(6); 2, 3, 0, 1, '2', '3', 'd']         console.log(arr6.concat(arr5));//[1, '2', '3', 'd', '1', 2, 3, 0]         console.log(arr5,arr6);//['1', 2, 3, 0]   [1, '2', '3', 'd']

  3. pop()这种方法会改变原数组
    功能:删除数组的最后一个元素  返回值:数组中删除的元素(当数组空时,返回undefined)              let arr1 = [],         arr2 = ['start','middle','end'];         console.log(arr1.pop()); //undefined          console.log(arr2.pop()); //end         console.log(arr2);       //['start', 'middle']      

  4. push()这种方法会改变原数组
    功能:在数组末尾添加一个或多个元素 语法:arr.push(element1...elementN) 参数:element:添加的元素 返回值:返回数组的新长度          let arr1 = [],         arr2 = ['start','middle','end'];          console.log(arr1.push('newElement一、二、三); //4         console.log(arr1);  //['newElement', 1, 2, 3]          console.log(arr2.push('add new',-1));       //5         console.log(arr2);  //['start', 'middle', 'end', 'add new', -1]

  5. shift()这种方法会改变原数组
    功能:删除数组的第一个元素 返回值:返回数组中删除的元素(如果数组为空,则返回undefined)          let arr1 = [0,1,2,3,4],             arr2 = [];          console.log(arr1.shift()); //0         console.log(arr1);         //[1, 2, 3, 4]         console.log(arr2.shift()); //undefined

  6. unshift()这种方法会改变数组
    功能:在数组头部添加(一个或多个元素) 返回值:返回新元素后的数组长度               //  头部新增值:unshift(可增加一个或多个值)         let arr = [[12,0],{as:1}]         console.log(arr.unshift('start,0,1,2,3);/7         console.log(arr); //['start', 0, 1, 2, 3, Array(2), {as:1}] 

  7. slice():不改变原数组
            slice(): 用于数组的浅拷贝             语法:arr.slice(start,end) :提取从start(包括start处)到end(不包括end结束的数组元素              参数:start: 下标(默认为0)开始提取,                         若为负数时,则-n指原数组倒数第n个元素的索引                         若大于原数组的索引范围,返回空数组                   end: 下标终止提取                        若它为负数(-n), 原数组中倒数第n个元素的提取                        若忽略,默认提取到最后             (与字符串slice()不同的方法,当提取的开始和结束索引为负,后者的绝对值大于前者时,前后索引不会交换)             返回值:返回符合提取条件的新数组                     let arr = [1,'a',1,0,122,'b',742,-1];              console.log(arr.slice(-1,)); //[-1]             console.log(arr.slice(-6,)); //[1, 0, 122, 'b', 742, -1]             console.log(arr.slice(8));   //[]             console.log(arr.slice(1,2)); //['a']              console.log(arr.slice(-5,-6);//[]             console.log(arr.slice(-5,-4)

  8. splice()这种方法会改变原数组
    功能:可添加、删除、替换数组元素 返回值:返回由删除元素组成的数组,如果不删除元素,返回空数组          // splice:删除或替换现有元素或添加新元素  会改变原数组         // array.splice(start     deleteCount  [item1,item2,item3...])                     // 开始的索引  删除元素数量  删除替换或添加的元素                     let array2 = ['Monday',20,'Wednesday',40,'Friday',60];         // 替换         onsole.log(array2.splice(1,1,'Tuesday')); //[20]
            array2.splice(3,1,'Thursday');
            // 删除
            array2.splice(5,1);
            // 新增
            array2.splice(5,0,'Saturday','Sunday');
            console.log(array2);//['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']

  9.    indexOf():不改变原数组
      indexOf():
             语法:arr.indexOf(searchElement, fromIndex)
    
             参数:searchElement:要查找的元素
    
                   fromIndex:开始查找的位置(下标):默认值为0
                              下标为负数时(查找顺序仍为从前往后):则将其作为数组末尾的一个抵消,即 -1 表示从最后一个元素开始查找
                              ,-2 表示从倒数第二个元素开始查找,若抵消后的索引值仍小于 0,则查询整个数组
    
                              下标大于等于数组长度时:返回-1
    
            返回值:返回第一次查找到的元素下标,没找到则返回-1
    
                
    
                let arr = ['a','b','c','a','d','e',-1];
    
                    console.log(arr.indexOf('a'));   //0
                    console.log(arr.indexOf('a',1)); //3
                    console.log(arr.indexOf('a',-7));//0
                    console.log(arr.indexOf('a',-8));//0
                    console.log(arr.indexOf('a',4)); //-1
                    console.log(arr.indexOf('a',-4));//3

  10.    lastIndexOf():不改变原数组
            lastIndexOf():返回指定元素在数组中出现的最后一个下标(逆向查找,但是下标仍为从左往右递增)
             
            语法:arr.indexOf(searchElement, fromIndex)
    
            参数:searchElement:要查找的元素
                 fromIndex:开始查找的下标(默认为数组长度减一,即从最后一个元素开始逆向查找)
                            如果该值大于或等于数组的长度,则整个数组会被查找
                            若为负值,将其视为从数组末尾向前的偏移
                            若该值为负值且其绝对值大于等于数组长度,则返回 -1
               
            返回值:返回最后一次查找到的元素下标,没找到则返回-1
           
                let arr = ['ncsu',1,31,657,'snc',1,null,{a:1},'e'];
    
                console.log(arr.lastIndexOf(1));  //5
                console.log(arr.lastIndexOf(2));  //-1
                console.log(arr.lastIndexOf(1,9));//5
                console.log(arr.lastIndexOf(1,-4));//5
                console.log(arr.lastIndexOf(1,-5));//1
                console.log(arr.lastIndexOf(1,-9));//-1

ES6:

数组扩展方法:

  1.    find():不改变原数组
    作用:返回满足条件的第一个元素(不满足则返回undefined)
    语法:arr.find(callback[, thisArg])
    参数:callback:在数组每一项上执行的函数,接收3个参数(element index array)
         thisArg(可选):执行回调时用作 this 的对象。
    
            //find 返回数组元素
            let arr = [12,43,50,52524,313],
                e1 = arr.find(function(element){
                    if(element > 100){
                        return element;
                    }
                })
                e2 = arr.find(function(element){
                    if(element < 10){
                        return element;
                    }
                })
            console.log(e1); //52524,返回数组元素
            console.log(e2); //undefined

  2.    findIndex():不修改原数组
    返回值:返回数组中满足条件的第一个元素的下标(索引),没有则返回-1
    参数:同find()方法
    
            // findIndex 返回符合条件的下标
            console.log(arr1.findIndex(function(element,index,arr){
                if(element > 100){
                    return element;
                }
            })); //3
    
            console.log(arr1.findIndex(function(element,index,arr){
                if(element < 10){
                    return index;
                }
            })); //-1

  3.    fill():会改变原数组
    语法:arr.fill(value, startIndex , endIndex);
    
    参数:
         value:用于填充数组元素的值
         startIndex:填充开始的索引(使用中为写值时,默认为0)
                    当它为负数时,把它看成startIndex+arr.length
    
         endIndex:终止索引,当它为负数时,把它看成endIndex+arr.length
             
    返回值:修改后的数组
    
    
                // 用一个固定值填充一个数组中从起始索引到终止索引内的全部元素,不包括终止索引。
                let arr1 = [],
                    arr2 = [1,2,3,4];
                console.log(arr1.fill("hello"));        //空数组
                console.log(arr2.fill('start'));        //['start', 'start', 'start', 'start']
                console.log(arr2.fill('add new',2,5));  //['start', 'start', 'add new', 'add new']
                console.log(arr2.fill('change',-1));    // ['start', 'start', 'add new', 'change']  start:-1+4->3
                console.log(arr2.fill('replace',2,-1)); // ['start', 'start', 'replace', 'change']  end:-1+4->3 ->起终位置:(2,3)
                console.log(arr2);  //['start', 'start', 'replace', 'change']
    // 当开始和结束位置都为负数时,若开始位置加上数组长度,小于,结束位置加上数组长度的索引大小 则修改不生效
                console.log(arr2.fill('a',-1,-2));//->('a',3,2) ['start', 'start', 'replace', 'change']
                console.log(arr2.fill('b',-2,-1));//->('b',2,3) ['start', 'start', 'b', 'change']
    

  4.    entries():不改变原数组
                /*
                  简单了解:
                  entries():返回一个新的Array Iterator对象,该对象包含数组中每个索引的键/值对
                */
               let arr = [1,22,535,'dwf',['sdq',4]],
                   iterator = arr.entries();
               console.log(iterator);//Array Iterator {}
               console.log(iterator.next().value);//[0,1]
               console.log(iterator.next().value);//[1, 22]
               console.log(iterator.next().value);//[2, 535]
               console.log(iterator.next().value);//[3, 'dwf']
               console.log(iterator.next().value);//[4, Array(2)]

  5.    keys():不改变原数组
    keys()方法:返回一个包含数组中每个索引键的Array Iterator对象(返回数组中每个元素的下标)
               
    返回值:一个新的Array迭代器对象
        
                let arr1 = [1,[22],[1232]]
    	
    			let result=arr1.keys()
    			for (let a of result) {
    				console.log(a) //0 1 2
    			}

  6.    values():不改变原数组
    values()方法:返回一个新的 Array Iterator 对象,该对象包含数组每个索引的值
    
    返回值:一个新的迭代对象  
    
    
            let arr = [12,4324,'120',{s:111}],
                va =  arr.values();
            for(let value of va){
                console.log(value); 
                // 12 4324 120 {s:111}  
            }

  7.    includes():不改变原数组
    作用:用于检查一个数组中是否包含某个指定值
    
    语法:arr.includes(valueToFind, fromIndex)
    
    参数:valueToFind:要查找的指定元素值(0 的值将全部视为相等,与符号无关(即 -0 与 0 和 +0 相等))
          fromIndex: 查找开始的索引(下标)默认为0开始,若为负值,则开始索引为:fromIndex+arr.length
    
    
    返回值:布尔类型(true  / false)
    
            let  arr = [21,12,'c','Stwcs',['a'],{a:1}]
          
            console.log(arr.includes(12)); //true
            console.log(arr.includes(12,2));//false
            console.log(arr.includes(12,-5));//true ->(12,-5+6)->(12,1)
            console.log(arr.includes(12,-4));//false
            console.log(arr.includes('a')); //false
    

  8.    flat()
    语法:arr.flat(depth)
    
    参数:提取嵌套数组的结构深度(维度),默认为1
    
    返回值:一个的新数组
    
    
                //按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。
    			let arr=[[11,22,33],4,5,[[666,777],88,[999,[1111],100]]],
                    arr2 = arr.flat(3),
                    arr3 = arr.flat(1);
                
    			console.log(arr2);//[11, 22, 33, 4, 5, 666, 777, 88, 999, 1111, 100]
                console.log(arr3);// [11, 22, 33, 4, 5, Array(2), 88, Array(3)]
    			
    			console.log(arr); //[Array(3), 4, 5, Array(3)]

标签: 2sdq固态继电器

锐单商城拥有海量元器件数据手册IC替代型号,打造 电子元器件IC百科大全!

锐单商城 - 一站式电子元器件采购平台