博客

（ES6新增的数组方法和对象方法） 本节课，我们将会学习一些ES6新增的数组方法。

find();查找数组某个元素
findIndex();查找某个元素的索引值
some();数组中是否有元素符合条件
every();数组中是否所有的元素都符合条件
复制代码

以及对象方法

Object.assign(); 复制一个对象
Object.keys(); 得到一个对象的所有属性；
Object.values(); 得到一个对象的所有可枚举属性值；
Object.entries(); 得到一个对象的键值对数组；
Object.fromEntries(); entries的逆操作；
复制代码

新增的数组方法 find() 在开发当中，我们经常有一个需求就是去寻找数组中的某个元素。那么，使用我们之前学过的方法，无论使用哪一种。写下的代码都不会很少。而且，为了避免性能的浪费，我们应该在找到符合的元素之后，就结束这个循环。那么，就限制了我们只能使用for循环或者是for of去做这件事情。

var arr = [
    {
        name: "Tom",
        age: 18
    },
    {
        name: "Jerry",
        age: 19
    },
    {
        name: "Alex",
        age: 28
    }
]

let person;

for(let val of arr){
    if(val.name === "Jerry");
    person = val;
    break;
}
复制代码

那么在ES6当中，查找一个符合要求的元素将变得特别简单。 我们可以使用find()函数来查找数组中符合要求的元素。该方法接收一个函数，函数的参数分别对应着 item,index,array

arr.find((item, index, arr) => {
    if(item == "Jerry"){
        return true;
    }
    else {
        return false;
    }
    
})
复制代码

当然，我们可以写得更加优美的代码如下：

arr.find(item => item == “Jerry”) findIndex 同样的，有些时候，我们在循环外，想要获得某个数组元素的索引值，ES6同样给我们提供了语义更清晰，更好用的findIndex。

我现在想要拿到名字是Alex的人在数组中的index。那么，使用findIndex可以这么写。

const index = arr.findIndex(item => name == "Alex");
复制代码

some some方法见名知意，就是为了查看数组中，是否有特定的元素满足条件的。我现在的需求是想知道，数组元素中，是否有一个人的年龄是大于20岁的。使用some方法可以快速的做到这件事。

arr.some(item => item.age > 20) //true
复制代码

该方法只要查找到元素中有任何一个元素满足条件，就会返回true

every every方法是针对于some方法的，该方法必须查找到数组中全部元素都满足条件才回返回true，如果有一个不满足条件，就返回false，并终止循环。

现在我想查看是否所有人都大于17岁

arr.every(item => item.age>17); //true
复制代码

新增的对象方法 Object.assign() 该方法主要用于拷贝一个对象的属性值到另一个对象。可以接受多个参数。该方法会直接修改第一个对象的属性。并返回拷贝后的对象，需要注意的是，该方法实现的是浅拷贝。

var obj1 = {
        name: 'first',
        desc: 'second'
    }

var obj2 = {
        color: 'red',
        hop: 'go'
    }

var obj3 = {
        background: 'skyblue'
    }

var obj4 = Object.assign(obj1, obj2, obj3);
console.log(obj4)   
/*
background: "skyblue"
color: "red"
desc: "second"
hop: "go"
name: "first"*/
console.log(obj1)
/*
background: "skyblue"
color: "red"
desc: "second"
hop: "go"
name: "first"*/
复制代码

Object.keys(); 返回该对象的所有属性名数组；

var obj1 = {
        name: 'first',
        desc: 'second'
    }

console.log(Object.keys(obj1))

/*
0: "name"
1: "desc"
*/
复制代码

Object.values(); 返回该对象所有属性值的数组；

var obj1 = { name: ‘first’, desc: ‘second’ }

console.log(Object.values(obj1))

/*
0: "first"
1: "second"
*/
复制代码

Object.entries() 返回该对象的键值对数组；

 var obj1 = {
            name: 'first',
            desc: 'second'
        }
    
console.log(Object.entries(obj1))

/*
["name", "first"],
["desc", "second"]
*/
复制代码

由于数组也属于对象，只是属于比较特殊的对象，所以，数组自身继承了entries方法。所以该方法可以结合for of 以及数组解构使for of循环循环数组时，也能得到index值；

var arr = ["鸡肉", "牛肉", "烤鱼"];

for([index, value] of arr.entries()) {
    console.log("索引值", index);
    console.log("数组项", value);
}
复制代码

image

Object.fromEntries(); 该方法是entries方法的逆运算，需要注意的是，支持该方法的浏览器并不多。

var obj = Object.fromEntries([
        ["property1", "value1"],
        ["property2", "value2"],
    ])

console.log(obj);
复制代码

image 可以通过增加Object原型对象方法实现polyfill.

Object.defineProperty(Object.prototype, "fromEntries", {
        enumerable: false,
        value(arr) {
            var obj = {};
            for(var i = 0; i < arr.length; i++) {
                obj[arr[i][0]] = arr[i][1]
            }
            return obj;
        },
        configurable: true,
        writable: true
    })复制代码