0
点赞
收藏
分享

微信扫一扫

数组API

凌得涂 2022-03-12 阅读 119
javascript前端

数组常用api（全）

  • push（末尾添加一个值）
  • unshift（开头加一个值）
  • pop（末尾删去一个值）
  • shift（删除第一个值）
  • slice （根据下标获取数组中的部分数据，未修改原数组，第二个参数为结束位置）
  • splice（数组指定位置进行插入或删除数据，修改了原数组，第二个参数为删除的个数个数，后面所有数为插入的数值）
  • concat（和一个或多个数组进行合并，得到一个新数组）
  • join（能够将数组里的数据拼接转为字符串，可以指定隔开“ ”）
  • toString/valueOf:返回数组的字符串表示,用“，”隔开
  • reverse（数组倒序存放）
  • indexOf（获取某数据在数组中的第一次出现的下标，没有的话返回-1）
  • lastIndexOf（获取某数据在数组中的最后一次出现的下标，没有的话返回-1）
  • sort（对数组进行排序）
  • forEach （遍历数组中的所有元素）
  • every(用来判断所有的数组元素，都满足一个条件)
  • some(用来判断所有的数组元素，只要有一个满足条件即可)
  • map(将元素重新组装，并返回)
  • filter(通过某一个条件过滤数组)
  • Array.from()：将类数组结构转化为数组实例
  • Array.of（）:可以把一组参数转化为数组
  • Array.isArray():判断一个值是否为数组
  • keys():返回数组索引的迭代器
  • values():返回数组元素的迭代器
  • entrise（）：返回索引/值对的迭代器
  • fill:向已有数组中插入全部或部分相同的值，copyWithin（）浅复制
  • includes:找到一个与指定元素匹配的项，返回布尔值
  • find返回第一个匹配的元素
  • findIndex返回第一个匹配元素的索引
  • reduce():从数组中的第一项开始，逐个遍历到最后
  • reduceRight():从数组的最后一项开始，向前遍历到第一项

push：数组末尾添加数据

数组变量名.push(数据1,数据2,数据n);
例子:
var arr = [1,2,3,4,5];
arr.push(6);
arr.push(7,8,9);
document.write(arr);//[1,2,3,4,5,6,7,8,9];

pop:删除数组末尾最后一个数据，返回被删除的数据

数组变量名.pop();
例子:
var arr = [1,2,3,4,5];
//arr.pop();//删除最后一个数据
var data = arr.pop();//删除最后一个数据,data变量保存的是被删除的数据
document.write(arr);//[1,2,3,4,5];

unshift:数组开头添加一个多个数据

数组变量名.unshift(添加的数据);
例子：
var arr = [1,2,3,4,5];
arr.unshift(0);//开头添加0 
document.write(arr);//[0,1,2,3,4,5];

splice：数组指定位置进行插入或删除数据

数组变量名.splice(插入或删除的开始下标,要删除的数量,插入的数据1,插入的数据2,插入的数据3,插入的数据n);
例子： 
var arr = [1,2,3,4,5];
//只删除3 和4
//arr.splice(2,2);
//document.write(arr);//[1,2,5];
//删除2 和5 
//arr.splice(1,1);
//arr.splice(3,1);
//document.write(arr);//[1,2,5];
//在3之前插入 6 和7
//arr.splice(2,0,6,7);
//document.write(arr);//[1,2,6,7,3,4,5];
//删除45，并追加67 
arr.splice(3,2,6,7);//[1,2,3,6,7]
  • 如果只有一个参数，那么会从开始下标开始，删除数组的后续所有元素

join:能够将数组里的数据拼接转为字符串

数组变量名.join(数据的分隔符号)
例子：
var arr = [1,2,3,4,5];
arr.join('-');
document.write(arr);//1-2-3-4-5
  • join中默认的分割符号是,。即数据之间以逗号分割。
  • join生成的字符串需要定义一个变量来接收，接收后进行使用

toString/valueOf:返回数组的字符串表示

const a=["liu","zhao","wang"];
a.toString();//liu,zhao,wang
a.valueOf();//liu,zhao,wang

reverse:数组倒序存放

数组变量名.reverse();
var arr = [1,2,3,4,5];
arr.reverse();
document.write(arr);
  • reverse是直接对原数组进行操作

concat ：和一个或多个数组进行合并，得到一个新数组

数组变量名.concat(数组1，数组2，数组n)；
例子：
var arr1 = [1,2,3,4,5];
var arr2= [6,7,8,9,10];
var arr3= [11,12,13,14,15];
//三个数组进行合并
var newArr = arr1.concat(arr2,arr3);
document.write(newArr);
  • 对原数组没有影响，得到的是新数组

slice：根据下标获取数组中的部分数据

数组变量名.slice(子数组的开始下标，子数组的结束下标);
例子：
var arr1 = [1,2,3,4,5];
//获取[2,3,4];
var newArr =arr1.slice(1,4);
document.write(newArr);
//其他使用方式
var arr=["顺丰","韵达","圆通","顺丰","韵达","京东","京东","韵达","顺丰","京东"];
var newArr = arr.slice(arr.length-4,arr.length);
var newArr = arr.slice(arr.length-4);
var newArr = arr.slice(-4);
document.write(newArr);//都是最后四个
  • slice获得的是一个新数组，所以一般需要变量接收后进行使用
  • slice:新数组是不包含结束下标对应数据
  • 如果直接以数组末尾结束，那么结束下标可以省略不写
  • 支持开始下标为负数，从倒数第几个开始

indexOf:获取某数据在数组中的第一次出现的下标，没有的话返回-1

var index = 数组变量名.indexOf(数据);
例子：
var arr = [1,2,3,4,5,2];
var index = arr.indexOf(3);// 2
var index = arr.indexOf(2);// 1
var index = arr.indexOf(6);// -1

sort : 对数组进行排序

数组变量名.sort();//按照自然顺序进行排序
自定义排序： 
数组变量名.sort(排序函数);
例子：
自然排序
var arr1 =[1,2,3,'c',7,4,'b',9,'a',8,6,5,'z'];
        //默认排序
 arr1.sort();
document.write(arr1);
自定义排序
var arr2 = [123,432,111,65,4,234,996,332];
function demo(num1,num2){
            //表示数组中相邻的两个数据，根据return的结果来进行排序。
            //如果return的结果大于0，那么num1就排在num2前面
            //如果return的结果小于0，那么num1就排在num2后面
            //如果return的结果==0，那么num1num2会挨在一起
            return  num2 -num1;
}
arr2.sort(demo);
document.write(arr2);// 996,432,332,234,123,111,65,4

随机打乱顺序
arr.sort(function(num1,num2){return Math.random()-0.5})
  • 第一种排序-不添加参数：按照自然顺序来处理。自然顺序是按照0-9、a-z来进行排序
  • 第二种需要我们提供一个排序函数，该函数就决定了数组里的两个相邻数据如何进行排序

lastIndexOf:获取某数据在数组中的最后一次出现的下标，没有的话返回-1

var index = 数组变量名.lastIndexOf(数据);
例子：
var arr = [1,2,3,4,5,2];
var index = arr.lastIndexOf(3);// 2
var index = arr.lastIndexOf(2);// 5
var index = arr.lastIndexOf(6);// -1

forEach:遍历数组所有元素

var arr = [1,2,3]
arr.forEach(function (item, index) {
    // 遍历数组的所有元素
    console.log(index, item)
})

every：用来判断所有的数组元素，都满足一个条件

var arr = [1,2,3]
var result = arr.every(function (item, index) {
    // 用来判断所有的数组元素，都满足一个条件
    if (item < 4) {
        return true
    }
})
console.log(result)

some:用来判断所有的数组元素，只要有一个满足条件即可

var arr = [1,2,3] 
var result = arr.some(function (item, index) {    
// 用来判断所有的数组元素，只要有一个满足条件即可    
if (item < 2) {
return true    
} 
}) 
console.log(result)

map:将元素重新组装，并返回

var arr = [1,2,3,4]
var arr2 = arr.map(function(item, index) {
    // 将元素重新组装，并返回
    return '<b>' + item + '</b>'
})
console.log(arr2)

filter:通过某一个条件过滤数组

var arr = [1,2,3]
var arr2 = arr.filter(function (item, index) {
    // 通过某一个条件过滤数组
    if (item >= 2) {
        return true
    }
})
console.log(arr2)

Array.from()：将类数组结构转化为数组实例

console.log(Array.from('hah'));//["h","a","h"]
//可以接第二个参数，第二个参数是函数，改变数组的值
const a1=[1,2,3,4];
console.log(Array.from(a1,x=>x**2));//[1,4,9,16]

Array.of（）:可以把一组参数转化为数组

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

Array.isArray():判断一个值是否为数组

var arr1 = [10, 20, 30, 40, 50];
        var a = 10;
        console.log( Array.isArray(arr1));//true
        console.log( Array.isArray(a));//false

keys():返回数组索引的迭代器 ，values():返回数组元素的迭代器entrise（）：返回索引/值对的迭代器

const a=["liu","zhao","wang"];
console.log(Arrry.from(a.key()));//[0,1,2]
console.log(Arrry.from(a.values()));//["liu","zhao","wang"]
console.log(Arrry.from(a.entrise()));//[[0,"liu"],[1,"zhao"],[2,"wang"]]

fill:向已有数组中插入全部或部分相同的值，copyWithin（）浅复制

const a=[1,1,1,1];
a.fill(2);//[2,2,2,2]
a,fill(2,1);//[1,2,2,2]索引大于等于1

includes:找到一个与指定元素匹配的项，返回布尔值

const a=[1,1,1,1];
a.include(2);//false
a.include(1);//true

find返回第一个匹配的元素，findIndex返回第一个匹配元素的索引

 const people=[
            {
                name:"xiaohua",
                age:27
            },
            {
                name:"xiaobai",
                age:29
            }
        ];
        console.log(people.find((element,index,array)=>element.age<28));
        //{name: 'xiaohua', age: 27}
        console.log(people.findIndex((element,index,array)=>element.age<28));//0

reduce():从数组中的第一项开始，逐个遍历到最后，reduceRight():从数组的最后一项开始，向前遍历到第一项。

let num = [0, 1, 2, 3, 4];
        let sum=num.reduce(function (pre, cur, index, array) {
            return pre + cur;
        },2);//pre前一个值，cur当前值，index索引，array数组，初始值为2
        console.log(sum);//12
举报

相关推荐

新增数组API

数组html取值HarmonyOS后端开发

js数组api

javascript

数组API函数

javascriptlinq开发语言

JS——数组常用API

javascript前端

数组对象api汇总

javascript前端vue.js

数组的API总结

vue前端

【JavaScript】数组常用API

前端javascript

js基础之数组API

javascript前端开发语言

JavaScript-数组高级API

html数组i++JavaScript前端开发

ES6数组新增API

华为智能路由器
0 条评论