美文网首页
JS数组方法

JS数组方法

作者: 子墨子沐 | 来源:发表于2020-06-29 14:10 被阅读0次

    参考链接:https://www.cnblogs.com/obel/p/7016414.html

    JS中创建数组的方法:

    方法一:使用Array构造函数

    var arr1 = new Array();  //创建一个空数组

    var arr2 = new Array(20); //创建一个包含20项的数组

    var arr3 = new Array("lily", "tom", "pop"); //创建包含3个字符串的数组

    方法二:使用数组字面量表示

    var arr4 = []; //创建一个空数组

    var arr5 = [20]; //创建一个包含1项的数组

    var arr6 = ["lily","tom","pop"]; //创建包含3个字符串的数组

    数组的原方法都是基于 Array.prototype

    改变数组的方法:push pop unshift shift reverse(倒序) splice(开始的索引,长度,插入的值) sort(排序)

    var  a = [3,6,9,12,15]

    a.push(18)    //返回长度6

    a.pop()          //返回删除的那一项数据 18

    a.unshift(21)  //返回长度6

    a.shift()          //返回删除的那一项数据 21

    a.reverse()    //返回翻转后的数组 [15,12,9,6,3]

    a.sort()          //返回比较后的数组  如果都是数据需要借助 a-b 从小到大  b-a 从大到小

    a = [3,6,9,12,15]

    a.splice(1,1)  //返回删除的那一项 [6]  a 变成 [3,9,12,15]

    a.splice(1,0,7)  //返回空数组 []  a变成[3,7,9,12,15]

    a.splice(1)        //返回删除从当前索引到最后的项  [7,9,12,15]    a变成[3]

    不改变数组的方法:toString slice(开始索引,结束索引) join  concat(两个数组链接)  indexOf(从左到右第一次符合条件的索引)  lastIndexOf(从右到左第一次符合条件的索引) 

    得有对象接收

    var a = ['a','b','c','e']

    var b = a.toString()       

    console.log(b)//返回 'a,b,c,d'

    b = a.slice(1)

    console.log(b) //返回 ['b','c','d']   

    b = a.slice(1,2)

    console.log(b) //返回['b']       

    b = a.join()

    console.log(b) // 'a,b,c,d'

    b = a.join('-')

    console.log(b) // 'a-b-c-d'

    扩展方法:every some forEach map filter(浅拷贝,去重) reduce(第一个往最后一个) reduceRight(最后一个往第一个)

    every每一项都满足条件才能返回true,否则返回false

        var  = this.productBox.every(function(el){

            return el.price > 40

        })

        console.log(res)  //每一项都大于40才能返回true

    some 有一项满足条件就返回true,否则返回false

        var  = this.productBox.some(function(el){

            return el.price > 40

        })

        console.log(res)  //有一项都大于40才能返回true

    forEach 查询每一项,也可以修改数组

        this.productBox.forEach(function(item){

             if(item.price > 20){

                item.price = item.price - 10

            }

        })

        console.log(JSON.stringify(this.productBox))

    map

        1、map() 方法返回一个新数组,新数组中的元素为原始数组中的每个元素调用函数处理后得到的值。

        2、map() 方法按照原始数组元素顺序依次处理元素。

            注意: map() 不会对空数组进行检测。

            注意: map() 不会改变原始数组。

            注意:函数的作用是对数组中的每一个元素进行处理,返回新的元素。

        3、语法

            map是数组的方法,有一个参数,参数是一个函数,函数中有3个参数

                参数1:item必须。当前元素的值

                参数2:index,可选。当前元素在数组中的索引值

                参数3:arr可选。当前元素属于的数组对象

           array.map(function(item,index,arr){})

           var arr = [2,3,4,5]

           var newarr = arr.map(function(item,index,array){

              item = item * 2

               return item

            })

            console.log(newarr)  //[4,6,8,10]

    filter  可以浅拷贝,也可以数组去重

        var list = [1,2,3,2,4,3,4]

        var res = list.filter(function(item,index,array){

          return array.indexOf(item) === index

        })

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

    reduce 累加  从左向右

        var arr = [1,2,3,4]

        var sum = arr.reduce(function(pre,cur,index,array){

            console.log(pre,cur,index)

            return pre + cur

        })

        console.log(arr,sum)

        //1 2 1

        // 3 3 2

        // 6 4 3

        //[1, 2, 3, 4] 10

    reduceRight 累加  从右向左

        var arr = [1,2,3,4]

        var sum = arr.reduceRight(function(pre,cur,index,array){

            console.log(pre,cur,index)

            return pre + cur

        })

        console.log(arr,sum)

        //4 3 2

        // 7 2 1

        // 9 1 0

        //[1, 2, 3, 4] 10

    js中赋值主要有两种赋值形式,一种是值引用,另一种是址引用(地址)。

    一般对象赋值的时候,都是地址引用,所以在修改新对象的时候,其实修改了在内存区地址上的值。

    为了达到值引用的效果,所以有 深度克隆的概念。 

    使用 call() 方法,改变this指向。参考链接:https://www.jianshu.com/p/aa2eeecd8b4f

    深度克隆的代码

    var arr = [{a:1},{a:2},{a:3}]

    var newarr = cloneSun(arr)

    function cloneSun(obj, target) {

            var sunObj2 = target || {}; //继承传来的目标对象

            var toStr = Object.prototype.toString;

            for (var prop in obj) {

                if (obj.hasOwnProperty(prop)) {

                    if (typeof obj[prop] !== 'object' && obj[prop] !== 'null') {

                        sunObj2[prop] = obj[prop];

                    } else {

                        sunObj2[prop] = toStr.call(obj[prop]) === '[object Object]' ? {} : [];

                        cloneSun(obj[prop], sunObj2[prop]);

                    }

                }

            }

            return sunObj2

        }

    相关文章

      网友评论

          本文标题:JS数组方法

          本文链接:https://www.haomeiwen.com/subject/wdpofktx.html