Array 的方法(JavaScript)

处理数组

concat() 连接两个或更多的数组,并返回结果
注意:不会改变现有的数组,而仅仅会返回被连接数组的一个副本

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

from() 通过给定的对象中创建一个数组。
注意:不会改变原始数组

var arr = Array.from([1, 2, 3], x => x * 10);
// arr[0] == 10;
// arr[1] == 20;
// arr[2] == 30;

entries() 返回数组的可迭代对象。
可以用这个方法将Object 转成Array

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.entries().forEach (item = > {
    console.log(item)
});
// 输出:
// [0, "Banana"]
// [1, "Orange"]
// [2, "Apple"]
// [3, "Mango"]

join() 把数组的所有元素放入一个字符串。
注意:不会改变原始数组

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var energy = fruits.join('/'); // Banana/Orange/Apple/Mango

toString() 把数组转换为字符串,并返回结果。
注意:会改变原始数组

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.toString(); // Banana,Orange,Apple,Mango

pop() 删除数组的最后一个元素并返回删除的元素。
注意:会改变数组的长度
提示: 移除数组第一个元素,请使用 shift() 方法

var fruits = ["Banana", "Orange", "Apple", "Mango"];
const x = fruits.pop();
console.log(x) // Mango
console.log(fruits) // ["Banana", "Orange", "Apple"]

push() 向数组的末尾添加一个或更多元素,并返回新的长度。
注意: 新元素将添加在数组的末尾。
注意: 会改变数组的长度
提示: 在数组起始位置添加元素请使用 unshift() 方法。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi","Lemon","Pineapple")
console.log(fruits)
// 输出:[Banana,Orange,Apple,Mango,Kiwi,Lemon,Pineapple]

slice() 选取数组的的一部分,并返回一个新数组。
注意:会改变原始数组

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var best = fruits.slice(1, 3); // Orange, Lemon 
var myBest = fruits.slice(-3,-1); // Lemon, Apple
var str="www.runoob.com!";
document.write(str.slice(4)+"<br>"); // 从第 5 个字符开始截取到末尾
document.write(str.slice(4,10)); // 从第 5 个字符开始截取到第10个字符

splice() 从数组中添加或删除元素。
注意:会改变原始数组

// 移除数组的第三个元素,并在数组第三个位置添加新元素:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,1,"Lemon","Kiwi"); // Banana,Orange,Lemon,Kiwi,Mango

reverse() 反转数组的元素顺序。
注意:会改变原始数组

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.reverse(); // Mango,Apple,Orange,Banana

sort() 对数组的元素进行排序。
注意:默认排序顺序为按字母升序,当数字是按字母顺序排列时"40"将排在"5"前面。
注意:会改变原始数组

// 字母(升序)
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort(); // Apple,Banana,Mango,Orange
// 字母(降序)
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
fruits.reverse(); //Orange,Mango,Banana,Apple
// 数字(升序)
var points = [40,100,1,5,25,10];
points.sort(function(a,b){return a-b}); // 1,5,10,25,40,100
// 数字(降序)
var points = [40,100,1,5,25,10];
points.sort(function(a,b){return b-a}); // 100,40,25,10,5,1

copyWithin() 从数组的指定位置拷贝元素到数组的另一个指定位置中。
注意:会改变原始数组

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.copyWithin(2, 0); // Banana,Orange,Banana,Orange

fill() 使用一个固定值来填充数组。
注意:会改变原始数组

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.fill("Runoob", 2, 4); // Banana,Orange,Runoob,Runoob

查数组

every() 检测数值元素的每个元素是否都符合条件。(一假则假)
注意: 不会对空数组进行检测。
注意: 不会改变原始数组。

var ages = [32, 33, 16, 40];
ages.every(item => {
    return item >= 18
})
// 输出: false

some() 检测数组元素中是否有元素符合指定条件。(一真则真)
如果有一个元素满足条件,则表达式返回true, 剩余的元素不会再执行检测。
如果没有满足条件的元素,则返回false。
注意: 不会对空数组进行检测。
注意: 不会改变原始数组。

var ages = [32, 33, 16, 40];
ages.some(item => { 
    return item >= 18
})
// 输出: true

filter() 检测数值元素,并返回符合条件所有元素的数组。(获取全部)
注意: 不会对空数组进行检测。
注意: 不会改变原始数组。

var ages = [32, 33, 16, 40];
ages.filter(item => {
    return item >= 18
})
// 输出: 32, 33, 40

find() 返回符合传入测试(函数)条件的数组元素。(一真则停)
如果没有符合条件的元素返回 undefined
注意: 对于空数组,函数是不会执行的。
注意: 不会改变原始数组。

var ages = [32, 33, 16, 40];
ages.filter(item => {
    return item >= 18
})
// 输出: 32

findIndex() 返回符合传入测试(函数)条件的数组元素索引。(一真则停)
如果没有符合条件的元素返回 -1
注意: findIndex() 对于空数组,函数是不会执行的。
注意: findIndex() 并没有改变数组的原始值。

var ages = [32, 33, 16, 40];
ages.filter(item => {
    return item >= 18
})
// 输出: 0

map() 通过指定函数处理数组的每个元素,并返回处理后的数组。
注意: 不会改变原始数组。

const res = {
    name: 'zxf',
    sex: 1,
    age: 18,
    img: 'xxx'
}
const users=res.items.map(item => ({
    title: item.name,
        sex: item.sex === 1? '男':item.sex === 0?'女':'保密',
        age: item.age,
        avatar: item.img
    })
);

reduce() 将数组元素计算为一个值(从左到右)。
注意:如果想从右到左加用reduceRight()

// 1 数组求和,数组求积
var  arr = [1, 2, 3, 4];
var sum = arr.reduce((x,y)=>x+y)
var mul = arr.reduce((x,y)=>x*y)
console.log( sum ); //求和,10
console.log( mul ); //求乘积,24
// 2 计算数组中每个元素出现的次数
let names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
let nameNum = names.reduce((pre,cur)=>{
  if(cur in pre){
    pre[cur]++
  }else{
    pre[cur] = 1 
  }
  return pre
},{})
console.log(nameNum); 
// 输出:{Alice: 2, Bob: 1, Tiff: 1, Bruce: 1}
// 3 数组去重
let arr = [1,2,3,4,4,1]
let newArr = arr.reduce((pre,cur)=>{
    if(!pre.includes(cur)){
      return pre.concat(cur)
    }else{
      return pre
    }
},[])
console.log(newArr);// [1, 2, 3, 4]复制
// 4 二位数组转化为一维数组
let arr = [[0, 1], [2, 3], [4, 5]]
let newArr = arr.reduce((pre,cur)=>{
    return pre.concat(cur)
},[])
console.log(newArr); // [0, 1, 2, 3, 4, 5]。
// 5 对象里的属性求和
var result = [
    {
        subject: 'math',
        score: 10
    },
    {
        subject: 'chinese',
        score: 20
    },
    {
        subject: 'english',
        score: 30
    }
];
var sum = result.reduce(function(prev, cur) {
    return cur.score + prev;
}, 10);
console.log(sum) //70

includes() 判断一个数组是否包含一个指定的值。
注意: 不会改变原始数组。

let site = ['runoob', 'google', 'taobao'];
site.includes('runoob'); // true 
site.includes('baidu'); // false

indexOf() 搜索数组中的元素,并返回它所在的位置。
如果在数组中没找到指定元素则返回 -1。
提示如果你想查找字符串最后出现的位置,请使用 lastIndexOf() 方法。

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

isArray() 判断对象是否为数组。

let site = ['runoob', 'google', 'taobao'];
site.isArry(site); // true

instanceof Array 判断对象是否为数组。

let site = ['runoob', 'google', 'taobao'];
site instanceof Array; // rue
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值