码迷,mamicode.com
首页 > 编程语言 > 详细

数组Array的API1

时间:2018-10-15 14:23:56      阅读:175      评论:0      收藏:0      [点我收藏+]

标签:指定   for   def   结束   相等   赋值   本质   code   lin   

数组的方法
arr.includes()
arr.every(fn(val,i))
arr.some(fn(val,i))
arr.filter(fn(val,i))
arr.map(fn(val,i))
ar.reduce(fn(prev,current),initValue)
arr.sort()或arr.sort(fn(a,b))

arr.forEach(fn(val,i))

arr.copyWithin(target,start,end)

arr.fill(target,start,end)

 

 

1.arr.includes(function(val,i){})

理解:判断是否包含某个元素
使用:arr.includes()
参数:
返回值:返回值是布尔值。true,false
原数组:不改变

循环数组,每循环一次,执行一次回调函数,只要有一个元素为回调函数的指定元素,就结束循环,结果就是true;没有元素符合回调函数的指定元素,结果就是flase。

技术分享图片
    let arr1 = [0,1,2,3,4,5];

    let res1 = arr1.includes(5);
    let res2 = arr1.includes(6);

    console.log(‘原数组‘,arr1);             // [0,1,2,3,4,5]
    console.log(‘返回值‘,res1);             // true
    console.log(‘返回值‘,res2);             // false
View Code

 

 

2.arr.forEach(function(val,i){})判断所有

理解:判断所有
使用:arr.forEach()
参数:
返回值:没有返回值
原数组:不改变

返回值是布尔值。循环数组,每循环一次,执行一次回调函数。

技术分享图片
    let arr1 = ["a","b","c","d"];

    arr1.forEach((item,i,arr)=>{
        console.log(item,i,arr);    //a 0 (4) ["a", "b", "c", "d"]
    })
View Code

 


2.arr.every(function(val,i){})判断所有

理解:判断所有
使用:arr.every()
参数:
返回值:返回值是布尔值。true,false
原数组:不改变

返回值是布尔值。循环数组,每循环一次,执行一次回调函数,只要有一个元素的回调函数的返回值是false,就结束循环,结果就是false;只有所有元素符合回调函数的条件,结果就是true。

技术分享图片
    let arr1 = [0,1,2,3,4,5];

    let res1 = arr1.every((item,i,arr)=>{
        console.log(item,i,arr);    //a 0 (4) ["a", "b", "c", "d"]
        return item > 2
    })

    let res2 = arr1.every((item,i,arr)=>{
        console.log(item,i,arr);    //a 0 (4) ["a", "b", "c", "d"]
        return item < 6
    })

    console.log(‘原数组‘,arr1);             //["a", "b", "c", "d"]
    console.log(‘返回值‘,res1);             //false
    console.log(‘返回值‘,res2);             //true
View Code

 


3.arr.some(function(val,i){})判断是否含有

理解:判断是否含有。
使用:arr.some()
参数:
返回值:返回值是布尔值。true,false
原数组:不改变

返回值是布尔值。循环数组,每循环一次,执行一次回调函数,只要有一个元素的回调函数的返回值是true,就结束循环,结果就是true;只有所有元素不符合回调函数的条件,结果就是false。

技术分享图片
    let arr1 = [0,1,2,3,4,5];

    let res1 = arr1.some((item,i,arr)=>{
        console.log(item,i,arr);    //a 0 (4) ["a", "b", "c", "d"]
        return item > 2
    })

    let res2 = arr1.some((item,i,arr)=>{
        console.log(item,i,arr);    //a 0 (4) ["a", "b", "c", "d"]
        return item > 6
    })

    console.log(‘原数组‘,arr1);             //["a", "b", "c", "d"]
    console.log(‘返回值‘,res1);             //true
    console.log(‘返回值‘,res2);             //false
View Code

 


4.arr.filter(function(val,i){})过滤符合条件的元素,集合成数组

理解:过滤符合条件的元素,集合成数组
使用:arr.filter()
参数:
返回值:返回符合条件的元素组成的新数组
原数组:不改变

返回值是数组。循环数组,每循环一次,执行一次回调函数,只要元素满足回调函数的条件,就将元素添加到新数组,循环结束后,返回新数组。

技术分享图片
    let arr1 = [0,1,2,3,4,5];

    let res1 = arr1.filter((item,i,arr)=>{
        console.log(item,i,arr);    //a 0 (4)  [0,1,2,3,4,5]
        return item >2
    })

    console.log(‘原数组‘,arr1);             // [0,1,2,3,4,5]
    console.log(‘返回值‘,res1);             // [3, 4, 5]
View Code

 

 

5.arr.map(function(val,i){})按条件映射出新的元素,集合成数组

理解:按条件映射出新的元素,集合成数组
使用:arr.map()
参数:
返回值:于原数组长度相等的新数组
原数组:不改变

返回值是数组。循环数组,每循环一次,执行一次回调函数,按照条件映射出新的元素,集合成新的数组,并返回数组。
技巧:拼接ul中li时,可以datas.map(function(){return ‘<li><li>‘}).join(‘‘)

技术分享图片
    let arr1 = [0,1,2,3,4,5];

    let res1 = arr1.map((item,i,arr)=>{
        console.log(item,i,arr);    //a 0 (4)  [0,1,2,3,4,5]
        return item + ‘a‘
    })

    console.log(‘原数组‘,arr1);             // [0,1,2,3,4,5]
    console.log(‘返回值‘,res1);             // ["0a", "1a", "2a", "3a", "4a", "5a"]
View Code

 

6.arr.reduce(callback,initValue)

理解:
使用:arr.reduce()
参数:
返回值:返回回调函数的计算之后的值。
原数组:不改变

callback(prevValue, currentValue)
prevValue: 上一次的值;
currentValue: 当前的值。 initValue会赋值给prevValue作为初始值,如果没有传入,那么prevValue的值为数组的第0个;callback每次返回的值将作为callback下一次执行的prevValue;循环完成以后最后一次callback返回的值将作为该reduce函数的结果。

arr.reduce()也可以完成arr.map()映射的任务。

技术分享图片
    let arr1 = [0,1,2,3,4,5];

    let res1 = arr1.reduce(function(prev,current,i,ar){
        // console.log(prev,current,i,ar)
        return prev + current;
    },0)

    console.log(‘原数组‘,arr1);             // [0,1,2,3,4,5]
    console.log(‘返回值‘,res1);             // 15
View Code
技术分享图片
//reduce--商品计价
    let goods = [
        {num : 3, price : 10},
        {num : 1, price : 1},
        {num : 2, price : 2},
        {num : 3, price : 3},
    ];

    let resGoods = goods.reduce(function (prev,current) {
        // console.log(prev,current,current.num,current.price)
        return prev + current.num*current.price
    },0)

    console.log(resGoods);            // 144
View Code

 

 

7.arr.sort(function(val,i){})

理解:重排
使用:arr.sort()
参数:
返回值:重拍之后的数组
原数组:改变


返回重排之后的数组。
a-b; 从小到大
a-b>0; 从小到大
a-b<0; 从大到小
b-a; 从大到小
b-a>0; 从大到小
b-a<0; 从小到大
1,true; 倒序
-1,false;顺序
0; 不变位置

技术分享图片
    let arr1 = [2,5,1,8];
    let res1 = arr1.sort();         //没有参数----升序

    let arr2 = [2,5,1,8];
    let res2 = arr2.sort((a,b)=>a-b);         //a-b  a-b>0   b-a<0   升序-----本质a>b

    let arr3 = [2,5,1,8];
    let res3 = arr3.sort((a,b)=>b-a);         //b-a   b-a>0   a-b<0    降序-----本质b>a

    let arr4 = [2,5,1,8];
    let res4 = arr4.sort((a,b)=>1);         //1    顺序

    let arr5 = [2,5,1,8];
    let res5 = arr5.sort((a,b)=>-1);         //-1     倒序

    console.log(‘原数组‘,arr1);             //[1, 2, 5, 8]
    console.log(‘返回值‘,res1);             //[1, 2, 5, 8]

    console.log(‘原数组‘,arr2);             //[1, 2, 5, 8]
    console.log(‘返回值‘,res2);             //[1, 2, 5, 8]

    console.log(‘原数组‘,arr3);             //[8, 5, 2, 1]
    console.log(‘返回值‘,res3);             //[8, 5, 2, 1]

    console.log(‘原数组‘,arr4);             //[8, 1, 5, 2]
    console.log(‘返回值‘,res4);             //[8, 1, 5, 2]

    console.log(‘原数组‘,arr5);             //[2, 5, 1, 8]
    console.log(‘返回值‘,res5);             //[2, 5, 1, 8]
View Code

 


8.Array.from()

理解:将伪数组转成数组
使用:Array.from()
参数:
返回值:转换之后的数组
原数组:

技术分享图片
    let arr1 = ‘012345‘;

    let res1 = Array.from(arr1);

    console.log(‘原数组‘,arr1);             // 012345
    console.log(‘返回值‘,res1);             // ["0", "1", "2", "3", "4", "5"]
View Code

 


9.Array.of()

理解:将伪数组转成数组
使用:Array.of()
参数:
返回值:转换之后的数组
原数组:

技术分享图片
     let arr1 = ‘012345‘;

    let res1 = Array.of(arr1);

    console.log(‘原数组‘,arr1);             // 012345
    console.log(‘返回值‘,res1);             // ["012345"]
View Code

 

10.arr.copyWithin(target,start,end)

理解:
使用:arr.copyWithin(target,start,end)
参数:

  target(必须): 从该位置开始替换数据.
  > start(可选):从该位置开始读取数据.
  > end(可选):到该位置的前一个位置.


返回值:改变之后的数组
原数组:改变

技术分享图片
    let arr1 = [‘a‘,‘b‘,‘c‘,‘d‘,‘e‘,‘f‘,‘j‘];
    let res1 = arr1.copyWithin(2,0);

    let arr2 = [‘a‘,‘b‘,‘c‘,‘d‘,‘e‘,‘f‘,‘j‘];
    let res2 = arr2.copyWithin(2,0,1);

    let arr3 = [‘a‘,‘b‘,‘c‘,‘d‘,‘e‘,‘f‘,‘j‘];
    let res3 = arr3.copyWithin(2);

    console.log(‘原数组‘,arr1);             // ["a", "b", "a", "b", "c", "d", "e"]
    console.log(‘返回值‘,res1);             // ["a", "b", "a", "b", "c", "d", "e"]
    console.log(‘原数组‘,arr2);             // ["a", "b", "a", "d", "e", "f", "j"]
    console.log(‘返回值‘,res2);             // ["a", "b", "a", "d", "e", "f", "j"]
    console.log(‘原数组‘,arr3);             // ["a", "b", "a", "b", "c", "d", "e"]
    console.log(‘返回值‘,res3);             // ["a", "b", "a", "b", "c", "d", "e"]
View Code

 

 

11.arr.fill(target,start,end)

理解:将目标字符,填充数组
使用:arr.fill(target,start,end)
参数:

  target(必须): 被填充的元素.
  > start(可选):从该位置开始读取数据.
  > end(可选):到该位置的前一个位置.


返回值:改变之后的数组
原数组:改变

技术分享图片
    let arr1 = [‘a‘,‘b‘,‘c‘,‘d‘,‘e‘,‘f‘,‘j‘];
    let res1 = arr1.fill(2,0);

    let arr2 = [‘a‘,‘b‘,‘c‘,‘d‘,‘e‘,‘f‘,‘j‘];
    let res2 = arr2.fill(2,0,1);

    console.log(‘原数组‘,arr1);             // [2, 2, 2, 2, 2, 2, 2]
    console.log(‘返回值‘,res1);             // [2, 2, 2, 2, 2, 2, 2]
    console.log(‘原数组‘,arr2);             // [2, "b", "c", "d", "e", "f", "j"]
    console.log(‘返回值‘,res2);             // [2, "b", "c", "d", "e", "f", "j"]    
View Code

 

数组Array的API1

标签:指定   for   def   结束   相等   赋值   本质   code   lin   

原文地址:https://www.cnblogs.com/shaokevin/p/9777897.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!