JavaScript 数组的常见方法

最新推荐文章于 2023-02-06 14:19:27 发布

写代码的小猿子

最新推荐文章于 2023-02-06 14:19:27 发布

阅读量289

点赞数 2

文章标签： javascript 前端 java

本文链接：https://blog.csdn.net/weixin_64899102/article/details/126042022

版权

数组的方法清单

数组的类型相关：

方法	描述	备注
Array.isArray()	判断是否为数组
toString（）	将数组转换为字符
Array.from(arrayLike)	将伪数组转化为真数组
Array.of(value1,value2)	创建数组：将一系列值转换成数组

数组元素的添加和删除：

方法	描述
push()	向新数组的最后插入一个或多个元素，返回结果为新数组的长度	会改变新的数组
pop()	删除数组中最后一个元素，返回结果为被删除的元素	会改变原来的元素
unshift()	在数组最前面插入一个或者多个元素，返回结果为新数组的长度	会改变原数组
shift()	删除数组的第一个元素，返回结果为被删除的元素	会改变原来的数组
slice()	从数组中提取指定的一个或者多个元素，返回结果为新的数组	不会改变原数组
splice()	从新数组中删除指定的一个或者多个元素，返回结果为被删除元素组成的新数组	会改变原数组
fill()	填充数组：用固定的值填充数组，返回结果为新的数组	会改变原数组

数组的拆分和合并：

方法	描述
concat()	合并数组：连接两个或者多个数组，返回结果为新的数组	不会改变原数组
join()	将数组转为字符串，返回结果为转换后新的字符串	不会改变原数组
split()	将字符串按照指定的分割符，组装成为新的数组	不会改变原字符串

数组排列：

方法	描述
reverse()	反转数组，返回结果为反转后的数组	会改变新的数组
sort()	对数组的元素默认按照Unicode编码，从小到大进行排列	会改变新的数组

查找数组的元素：

方法	描述
indexOf(value)	从前往后索引，检索一个数组中是否含有指定的元素
lastIndexOf(value)	从后往前索引，检索一个数组是否含有指定的元素
includes(item)	数组中是否包含指定的内容
find(function())	找出第一个满足指定条件返回true的元素
findIndex(function())	找出第一个满足指定条件返回true的index
every()	确保数组中的每个元素都满足指定条件返回true，则停止遍历，此方法才返回true	全真才为真，要求每一项都返回true，最终的结果才返回true
some()	数组中只要有一个元素满足指定条件返回true，则停止遍历，此方法就返回true	一真即为真，只要有一项返回true，最终的结果就返回true

遍历数组：

方法	描述	备注
for循环	这个大家都懂
forEach（）	和for循环类似	forEach（）没有返回值，也就是说，它的返回值是undefined
map（）	对原数组中的每一项进行加工，将组成新的数组	不会改变原数组
filter()	过滤数组：返回结果是true的项，将组成新的数组，返回结果为新的数组	不会改变原数组
reduce	接收一个函数作为累加器，返回值是回值是回调函数累计处理的结果

数组具体实例：

isArray():判断是否为数组

语法：布尔值 =Array.isArray（被检查的数组）

toString（）：数组转换为字符串

字符串=数组.toString();

解释：把数组转换成字符串，每一项用，分割。

备注：大多数的数据类型都可以使用.toString()方法，将其转换成字符串。

Array.from():

array = Array.from(arrayLike);

伪数字：包含length属性的对象或可代替的对象。

Array.of():

举例

const arr = Array.of(1, 'abc', true);
console.log(arr); // 打印结果是数组：[1, "abc", true]

补充：new Array()和Array.of()的区别在于：当参数只要一个时，前者表示数组的长度，后者表示数组中的内容。

数组元素的添加和删除：

push() 向数据的最后插入一个或多个元素，返回结果为新数组的长度，会改变原数组，因为原数组变成了新数组。

举例：

var arr = ['王一', '王二', '王三'];
        var result1 = arr.push('王四'); // 末尾插入一个元素
        var result2 = arr.push('王五', '王六'); // 末尾插入多个元素
        console.log(result1); // 打印结果：4
        console.log(result2); // 打印结果：6
        console.log(JSON.stringify(arr));

pop（）

删除数组中的最后一个元素，返回结果为被删除的元素。

举例：

var arr = ['王一', '王二', '王三'];

var result1 = arr.pop();

console.log(result1); // 打印结果：王三
console.log(JSON.stringify(arr)); // 打印结果：["王一","王二"]

unshift():

在数组最前面插入一个或多个元素，返回结果为新数组的长度，会改变原数组，因为原数组变成了新数组，插入元素后其他元素的索引会依次调整。

var arr = ['王一', '王二', '王三'];

var result1 = arr.unshift('王四'); // 最前面插入一个元素
var result2 = arr.unshift('王五', '王六'); // 最前面插入多个元素

console.log(result1); // 打印结果：4
console.log(result2); // 打印结果：6
console.log(JSON.stringify(arr));

shift（）

删除数组中的第一个元素，返回结果为被删除的元素。

举例：

var arr = ['王一', '王二', '王三'];

var result1 = arr.shift();

console.log(result1); // 打印结果：王一
console.log(JSON.stringify(arr)); // 打印结果：["王二","王三"]

slice（）从数组中提取指定的一个或者多个元素，返回结果为新的数组

const arr = ['a', 'b', 'c', 'd', 'e', 'f'];

const result1 = arr.slice(); // 不加参数时，则获取所有的元素。相当于数组的整体赋值
const result2 = arr.slice(2); // 从第二个值开始提取，直到末尾
const result3 = arr.slice(-2); // 提取最后两个元素
const result4 = arr.slice(2, 4); // 提取从第二个到第四个之间的元素（不包括第四个元素）
const result5 = arr.slice(4, 2); // 空

console.log('arr:' + JSON.stringify(arr));
console.log('result1:' + JSON.stringify(result1));
console.log('result2:' + JSON.stringify(result2));
console.log('result3:' + JSON.stringify(result3));
console.log('result4:' + JSON.stringify(result4));
console.log('result5:' + JSON.stringify(result5));

splice（）从数组中删除指定的一个或者多个元素，返回结果为被删除元素组成的新数组。

举例：

var arr2 = ['a', 'b', 'c', 'd', 'e', 'f'];
var result2 = arr2.splice(-2); //删除最后两个元素

console.log('arr2：' + JSON.stringify(arr2));
console.log('result2：' + JSON.stringify(result2));

fill（）

用一个固定值填充数组，返回结果为新数组，会改变原数组。

// 指定位置进行填充
let arr1 = ['a', 'b', 'c', 'd'];
let arr2 = arr1.fill('f', 1, 3);

console.log(arr1); // ['a', 'f', 'f,' 'd']
console.log(arr2); // ['a', 'f', 'f,' 'd']

数组的合成和拆分

concat（）连接两个或者多个数组，返回结果为新的数组，不会改变数组。

concatenate（）方法的作用是数组合并

const arr1 = [1, 2, 3];
        const arr2 = ['a', 'b', 'c'];
        const arr3 = ['好啊', 'vae'];
        const result1 = arr1.concat(arr2);
        const result2 = arr2.concat(arr1, arr3);
        console.log('arr1 =' + arr1);
        console.log('arr2 =' + arr2);
        console.log('arr3 =' + arr3);
        console.log('result1 =' + result1);
        console.log('result2 =' + result2);

join（）

将数组转换为字符串，返回结果为转换后的字符串

var arr = ['a', 'b', 'c'];
        var result1 = arr.join(); 
        var result2 = arr.join('-'); 
        console.log(typeof arr); // 打印结果：object
        console.log(typeof result1); // 打印结果：string
        console.log('arr =' + arr);
        console.log('result1 =' + result1);
        console.log('result2 =' + result2);

split（）

通过指定的分割符，将一个字符拆分成一个数组。

reverse（）

举例：

var arr = ['a', 'b', 'c', 'd', 'e', 'f'];
        var result = arr.reverse(); // 将数组 arr 进行反转
        console.log(arr);
        console.log(result);

sort（）无参时，按照默认编码从小到大进行排列。

 let arr1 = ['e', 'b', 'd', 'a', 'f', 'c'];
        let result = arr1.sort(); // 将数组 arr1 进行排序
        console.log(arr1 );
        console.log(result);

includes()

判断一个数组中是否包含指定的元素，如果是，则会返回true，否则返回false。

参数中的position，如果不指定，则默认为0，如果指定，则规定了检索的起始位置。

const arr = [11, 12, 13, 14, 15];
console.log(arr.includes(12)); // 打印结果：true
console.log(name.includes(20)); // 打印结果：false

console.log(name.includes(11, 1)); // 打印结果：false

find（）一旦找到符号条件的第一个元素，将不再继续往下遍历。

let arr = [2, 3, 2, 5, 7, 6];

let result = arr.find((item, index) => {
    return item > 4; //遍历数组arr，一旦发现有第一个元素大于4，就把这个元素返回
});

console.log(result); //打印结果：5

findIndex（）

findIndex((item, index, arr) => {
    return true;
});

every（）

var arr1 = ['千', '百', '南', '北'];
        var bool1 = arr1.every(function (element, index, array) {
            if (element.length > 2) {
                return false;
            }
            return true;
        });
        console.log(bool1); //输出结果：false。只要有一个元素的长度是超过两个字符的，就返回false

        var arr2 = ['千', '百', '南', '北'];
        var bool2 = arr2.every(function (element, index, array) {
            if (element.length > 2) {
                return false;
            }
            return true;
        });
        console.log(bool2); //输出结果：true。因为每个元素的长度都是两个字符。

some（）

对数组中每个元素运行回调函数，只要有一个元素返回true，则停止遍历，此方法返回true。

for循环遍历

 const arr = ['一', '儿子', '永不止步'];
        for (let i = 0; i < arr.length; i++) {
            console.log(arr[i]); // arr[i]代表的是数组中的每一个元素i
        }

        console.log(arr);

forEach（）遍历

举例：

 let numArr = [1, 2, 3];

        numArr.forEach((item, index, arr) => {
            arr[index] = arr[index] * 2;
        });
        console.log(numArr); 

        // 2、数组的元素是引用数据类型时，直接修改对象
        let objArr = [
            { name: '奥特曼', age: 28 },
            { name: '奥特曼', age: 34 },
        ];

        objArr.forEach((item, index, arr) => {
            arr[index] = {
                name: '小明',
                age: '10',
            };
        });
        console.log(objArr); 

        // 3、数组的元素是引用数据类型时，修改对象的某个属性
        let objArr2 = [
            { name: '盖亚', age: 28 },
            { name: '塞亚', age: 34 },
        ];

        objArr2.forEach((item, index, arr) => {
            arr[index].name = '小明';
        });
        console.log(objArr2);

map（）：

var arr1 = [1, 3, 6, 2, 5, 6];

var arr2 = arr1.map(function (item, index) {
    return item + 10; //让arr1中的每个元素加10
});
console.log(arr2);

filter（）

let arr1 = [1, 3, 6, 2, 5, 6];

let arr2 = arr1.filter((item) => {
    if (item > 4) {
        return true; // 将arr1中大于4的元素返回，组成新的数组
    }
    return false;
});

console.log(JSON.stringify(arr1)); // 打印结果：[1,3,6,2,5,6]
console.log(JSON.stringify(arr2)); // 打印结果：[6,5,6]

reduce（）方法

let arr1 = [1, 2, 3, 4, 5, 6];

arr1.reduce((prev, item) => {
    console.log(prev);
    console.log(item);
    console.log('------');
    return 88;
}, 0);

未完待续。。。