数组API

1.数组序列化

toString() 在默认情况下都会以逗号分隔字符串的形式返回数组项

join() 使用指定的字符串用来分隔数组字符串

var arr = [1,5,2,8,10,{a:1}];
console.log(arr);//[ 1, 5, 2, 8, 10, { a: 1 } ]
console.log(arr.toString());//”1,5,2,8,10,[object Object]”
console.log(arr.join(""));//”152810[object Object]”
console.log(arr.join("-"));//”1-5-2-8-10-[object Object]”

// 数组也可以使用序列化工具进行转换,并且,数组也存在深拷贝浅拷贝的现象,也可以使用序列化工具解决此问题
var result = JSON.stringify(arr);
console.log(result);//”[1,5,2,8,10,{"a":1}]”
console.log(JSON.parse(result));//[ 1, 5, 2, 8, 10, { a: 1 } ]

2.构造函数的方法

  • Array.isArray() 用来判断某个变量是否是一个数组对象

  • Array.from() 从类数组对象或者可迭代对象中创建一个新的数组实例。

  • Array.of() 根据一组参数来创建新的数组实例,支持任意的参数数量和类型。

3.栈与队列方法

(1)Array.prototype.push()

push() 方法可向数组的末尾添加一个或多个元素,并返回新的长度。

语法:array.push(item1, item2, ..., itemX) item1, item2, ..., itemX 为要添加到数组的元素

// push()方法可向数组的末尾添加一个或多个元素,并返回新的长度。
    var a=[1,2,3,4,5,6,7,8];
    console.log(a.push('zhangsan'));//返回新的数组长度
    console.log(a);//打印添加元素后的数组
//等价于=>

//push()方法重构(具体实现方法)
Array.prototype.mypush=function(){//数组的构造函数的原型对象
        for(i=0;i<arguments.length;i++){
            this[a.length-1+1]=arguments[i]
         //a.length-1为数组的最后一个元素位置,每添加一个元素就加上1等于每添加一个元素后的数组长度i
         //在数组最后一项添加传入的实际参数
        }
        return this.length;//返回新的数组长度
    }
    var a=[1,2,3,4,5,6,7,8];
    console.log(a.mypush('zhangsan'));//返回新数组长度
    console.log(a);//打印添加元素后的新数组

//两种方法执行结果如下:
//9
//[ 1, 2, 3, 4, 5, 6, 7, 8, 'zhangsan' ]

(2)Array.prototype.pop()

pop() 方法用于删除数组的最后一个元素并返回删除的元素。

语法:array.pop()    返回被删除的元素

 //(2)pop()方法用于删除数组的最后一个元素并返回删除的元素。
        var b =[3,5,7,9,0,2,6];
        console.log(b.pop());//返回数组中最后一个被删除的元素
        console.log(b);//打印删除元素后的新数组

        //等价于=>


        //pop()方法重构(具体实现方法)
        Array.prototype.mypop=function(){
            if(this.length==0){
                return undefined;
            }else{
                var b1 = this[b.length-1];//定义一个变量接收原数组的最后一个元素
                b.length--;
                return b1;
            }
        }
        var b =[3,5,7,9,0,2,6];
        console.log(b.mypop());//返回数组中最后一个被删除的元素
        console.log(b);//打印删除元素后的新数组

        //两种方法执行结果如下:
        //6
        // [ 3, 5, 7, 9, 0, 2 ]

(3)Array.prototype.shift()

shift() 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。

语法:array.shift()   返回数组原来的第一个元素的值(删除的元素)。

//(3)shift()方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。


        var c = [22,45,77,9,0,1,4];
        console.log(c.shift());//返回数组中第一个被删除的元素
        console.log(c);//打印删除第一位元素后的新数组
        //等价与=> 


        //shift()方法重构(具体实现方法)
        Array.prototype.myshift=function(){
            var c1 = c[0];//提前获取数组的第一个元素
            for(var i=0;i<this.length;i++){
                c[i]=c[i+1];//将数组中的元素向前移一个位置(也就是把数组中第一位元素删除了)
            }
            c.length--;//原数组长度减一,不然最后打印新数组最后一个元素位置为空(undefined)
            return c1;//返回数组中第一个被删除的元素
        }
        c = [22,45,77,9,0,1,4];
        console.log(c.myshift());//返回数组中第一个被删除的元素
        console.log(c);//打印删除第一位元素后的新数组

         //两种方法执行结果如下:
        // 22
        // [ 45, 77, 9, 0, 1, 4 ]

(4)Array.prototype.unshift()

unshift() 方法可向数组的开头添加一个或更多元素,并返回新的长度。

语法:array.unshift(item1,item2, ..., itemX) item1,item2, ..., itemX为要添加的数组元素

//(4)unshift()方法可向数组的开头添加一个或更多元素,并返回新的长度。
        var a =[22,434,6,89,0,100];
        console.log(a.unshift('zhangsan','lisi',21));//9 返回添加元素后新数组长度
        console.log(a);//打印添加元素后的新数组
        
        // 等价于=>
        // unshift()方法重构(具体实现方法)
        Array.prototype.myunshift=function(){
        //提前第一个变量接收添加元素后的数组长度
           var a1=this.length+arguments.length;
           for(var i=a1;i>0;i--){
               if(i>arguments.length){
                  this[i-1]=this[i-1-arguments.length];
            //将原数组元素往后移arguments.length()位添加的元素的长度
            //this[5]=this[2] 
            //this[5]原来元素在添加元素后的位置 
            //this[2]原来元素在添加元素前的位置
               }else{
                   this[i-1]=arguments[i-1];
               }
           }
           return a1;
        }
        var a =[22,434,6,89,0,100];
        console.log(a.myunshift('zhangsan','lisi',21));//9 返回添加元素后新数组长度
        console.log(a);//打印添加元素后的新数组

        //两种方法执行结果如下:
        // 9
        // [ 'zhangsan', 'lisi', 21, 22, 434, 6, 89, 0, 100 ]

4.排序方法

(1)Array.prototype.reverse()

reverse() 方法用于颠倒数组中元素的顺序。

语法:array.reverse()

颠倒数组中元素的顺序:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.reverse();
console.log(fruits)
//fruits结果输出:Mango,Apple,Orange,Banana

(2)Array.prototype.sort()

sort() 方法用于对数组的元素进行排序。

排序顺序可以是字母或数字,并按升序或降序。

默认排序顺序为按字母升序。

语法:array.sort(sortfunction)

数组排序:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
console.log(fruits)

//默认按数组中每一个字符串第一个字母进行排序
//fruits 输出结果:Apple,Banana,Mango,Orange

数字排序(升序):

var points = [40,100,1,5,25,10];
points.sort(function(a,b){
    return a-b
});
//points输出结果:1,5,10,25,40,100

数字排序(降序):

var points = [40,100,1,5,25,10];
points.sort(function(a,b){
    return b-a
});
//fruits输出结果:100,40,25,10,5,1

5.操作方法

(1)Array.prototype.concat()

concat() 方法用于连接两个或多个数组。

语法:array1.concat(array2,array3,...,arrayX)

array2, array3, ..., arrayX ---可以是具体的值,也可以是数组对象。可以是任意多个。

合并三个数组的值:

var hege = ["Cecilie", "Lone"]; 
var stale = ["Emil", "Tobias", "Linus"]; 
var kai = ["Robin"]; 
var children = hege.concat(stale,kai);
//children 输出结果:Cecilie,Lone,Emil,Tobias,Linus,Robin

(2)Array.prototype.slice()

slice() 方法可从已有的数组中返回选定的元素。

slice()方法可提取字符串的某个部分,并以新的字符串返回被提取的部分。

语法:array.slice(start, end)

start表示开始选择数组元素下标索引值,end表示选择数组元素的结束位置,但不包括end

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"]; 
var citrus = fruits.slice(1,4);//从索引下标为1到3读取
console.log(citrus);
//[ 'Orange', 'Lemon', 'Apple' ]

(3)Array.prototype.splice()

splice() 方法用于添加或删除数组中的元素。

语法:array.splice(index,howmany,item1,.....,itemX)

index-表示从何处开始添加/删除元素

howmany-应该删除多少元素,必须是数字

item1,.....,itemX--要添加到数组的新元素

数组中删除并添加新元素:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
//从数组索引位置 2 开始,不删除元素,添加两个新的元素"Lemon","Kiwi"
fruits.splice(2,2,"Lemon","Kiwi");
//2表示从数组元素下标为2开始添加/删除元素,2表示从数组元素下标2开始删除元素的个数 并插入"Lemon","Kiwi"
console.log(fruits)
//fruits输出结果:[ 'Banana', 'Orange', 'Lemon', 'Kiwi' ]

6.位置方法

(1)Array.prototype.indexOf()

indexOf()方法可返回数组中被指定的元素位置(下标索引值)。

语法:array.indexOf(item,start) item为要查找的元素

查找数组中的 "Apple" 元素,并返回对应的索引值:

var fruits = ["Banana", "Orange", "Apple", "Mango"]; 
var a = fruits.indexOf("Apple");

//a结果输出:2
//以上输出结果意味着 "Apple" 元素位于数组中的第 3 个位置。

(2)Array.prototype.lastIndexOf()

lastIndexOf() 方法可返回一个指定的元素在数组中最后出现的位置,从该字符串的后面向前查找。

如果要检索的元素没有出现,则该方法返回 -1。

语法:array.lastIndexOf(item,start)

查找一个元素在一个数组中最后一次出现的位置并返回对应的下标:

//(2)lastIndexOf()方法可返回数组中被指定的元素在数组中最后一次出现的位置(下标索引值)

var b =[1,2,334,45,5,7,7,8,8,9,9,6,2];

等价于=>

lastIndexOf()方法重构(具体实现方法)

var b = [1,2,334,45,5,7,7,8,8,9,9,6,2];
Array.prototype.mylastIndexOf = function(e){//e形参
   for(var i = this.length - 1; i >= 0; i--){
    //从数组的最后一个元素的位置开始循环,第一次找到指定元素时就是指定元素在数组中最后出现的位置(下标索引值)
    //数组下标从0开始,所以i>=0
      if(this[i]== e){
        //当找到被指定的元素时,返回指向元素的下标索引值,否则继续循环寻找
        return i; 
      };
      continue;
   };
   return -1;
};
console.log(b.mylastIndexOf(7));// 6

//调用lastIndex(),并传入实参

7.迭代方法

(1)Array.prototype.every()

every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。

every() 方法使用指定函数检测数组中的所有元素:

  • 如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。

  • 如果所有元素都满足条件,则返回 true。

语法:array.every(function(currentValue,index,arr), thisValue)

检测数组 arr 的所有元素是否都大于1 :

var arr=[1,2,3,4,5]
var result=arr.every(function(item){
    return item>1//arr中的第一个元素不满足1>1,就不继续执行了,返回false
})
console.log(result);//false
// 1.every(function(item,index,arr){},this对象) 
// (1)第一个参数在数组中的每个元素都会执行到的函数,固定的
// ​(2)第二个参数是前面function内的this指向-- 第二个参数任意数据类型,传什么都可以
// ​(3)判断数组元素是否都满足某一条件,一项不满足直接跳出当前判断,符合短路原则
//every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。
Array.prototype.myevery=function(fun,obj){//item this
    for(i=0;i<this.length;i++){
        if(!(obj?fun.bind(obj)(this[i]):fun(this[i]))){
        //判断是否需要修改this指向(也就是有没有传入第二个参数),
        //this[i]传入数组项item实参去指向操作
            return false;
        }
    }
    return true
}
var arr=[1,2,3,4,5]
var result=arr.myevery(function(item){
    console.log(this)//全局变量global
    return item>1//短路原则
},'a')//传入第二个参数this就指向第二个参数
console.log(result);//false

(2)Array.prototype.some()

some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。

some() 方法会依次执行数组的每个元素:

  • 如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。

  • 如果没有满足条件的元素,则返回false。

  • 语法:array.some(function(currentValue,index,arr),thisValue)

检测数组arr中是否有元素大于 4:

var arr=[1,2,3,4,5];
var result=arr.some(function(item){
    return item>4  //一项满足 直接返回true
},'a') //第二个参数可以是任意数据类型)
console.log(result);//true

// 2.some(function(item,index,arr){},this对象)
// (1)第一个参数在数组中的每个元素都会执行到的函数,
// (2)第二个参数是前面function内的this指向-- 
// (3)判断数组元素是否有一个满足条件,一项满足,跳出判断,返回true符合短路原则
// mysome 如果有一项满足直接返回true,不再往后判断,直接返回true
Array.prototype.mySome=function(fun,obj){
    for(var i=0;i<this.length;i++){
        if((obj?fun.bind(obj)(this[i]):fun(this[i]))){
            return true
        }
    }
    return false
    };
    var arr=[1,2,3,4,5];
    var result=arr.mySome(function(item){
        console.log(this)
         //有第二个参数,this指向第二个参数;这里this打印两次,首先没有执行条件前,
         //打印了一次,后面数组项1不满足条件再打印一次,数组项2满足条件直接跳出判断不打印
        return item>4  //一项满足 直接返回true
    },{name:'zhangsan'}) //第二个参数可以是任意数据类型)
    console.log(result);//true

(3)Array.prototype.filter()

filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。

语法:array.filter(function(currentValue,index,arr), thisValue)

返回数组 arr 中所有元素都大于 3的元素:

var arr=[1,2,3,4,5]
var result=arr.filter(function(item){
    return item>3
})
console.log(result);//[ 4, 5 ]
//等价于=》
//3.filter(function(item,index,arr){},this对象) 过滤出满足某一条件的元素,组成新的数组
//filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。
Array.prototype.myfilter=function(fun,obj){
    var s =[];//空数组
    for(i=0;i<this.length;i++){
        if(obj?fun.bind(obj)(this[i]):fun(this[i])){
            s.push(this[i]);//把符合条件的数组对象添加到新的数组s上
        }        
    }
    return s;
}
var arr=[1,2,3,4,5]
var result=arr.myfilter(function(item){
    console.log(this)//全局变量global obj 打印5次
    return item>3
},{name:'zhangsan'})
console.log(result);//[ 4, 5 ] 

(4)Array.prototype.map()

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

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

语法:array.map(function(currentValue,index,arr), thisValue)

返回一个新数组,数组arr中所以元素为原始数组元素的两倍:

var arr=[1,2,3,4,5]
var result=arr.map(function(item){
    return item*2
})
console.log(result);//[ 2, 4, 6, 8, 10 ]
//4.map(function(item,index,arr){},this对象) 映射出元素的某一部分,组成新数组
//map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。
Array.prototype.mymap=function(fun,obj){
    var s =[];//空数组
    for(i=0;i<this.length;i++){
        s.push(obj?fun.bind(obj)(this[i]):fun(this[i]))//添加到一个空数组
    }
    return s;
}
var arr=[1,2,3,4,5]
var result=arr.mymap(function(item){
    console.log(this)//全局变量global
// 没有第二个参数this指向全局对象node 里面是global html文档中指向window 
// 有第二个参数this指向第二个参数
    return item*2
},'a')//传入第二个参数this就指向第二个参数
console.log(result);//[ 2, 4, 6, 8, 10 ]

(5)Array.prototype.forEach()

forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。

语法:array.forEach(function(currentValue, index, arr), thisValue)

列出数组的每个元素以及对应下标值,存在于那个数组中:

//Array.prottype.myForEach()
Array.prototype.myForEach=function(fun){
//数组的构造函数的原型对象
    for(var i=0;i<this.length;i++){
        fun(arr[i],i,arr);
    }   
}
var arr=[1,2,3];
arr.myForEach(function(item,index,arr){
    console.log(item,index,arr);
    //item当前原始值 index当前元素索引下标 arr当前元素所属的数组对象 
});
//1 0 [ 1, 2, 3 ]
//2 1 [ 1, 2, 3 ]
//3 2 [ 1, 2, 3 ]

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值