js自写一个适用于object对象的forEach方法

本文章代码运行环境为edge103.0.1264.44 (正式版本) (64 位)

理解需了解js原型链和对象的原型对象：

1.js的array对象都有一个forEach(elem, index, arr)方法:

let arr = [1, 2, 3, 4, 5];
arr.forEach((elem, index, arr)=>{
    console.log("输出:",elem,index);
})
//console输出如下：
//sentry.0fafaa00.js:1 输出：  1 0
//sentry.0fafaa00.js:1 输出：  2 1
//sentry.0fafaa00.js:1 输出：  3 2
//sentry.0fafaa00.js:1 输出：  4 3
//sentry.0fafaa00.js:1 输出：  5 4

//查看arr.__proto__.forEach和Array.prototype.forEach
arr.__proto__.forEach
//ƒ forEach() { [native code] }

Array.prototype.forEach
//ƒ forEach() { [native code] }

arr.__proto__ === Array.prototype
//true

可知Array的原型对象上就定义了forEach方法。

2.检测js的object是否支持forEach():

let obj = {
    name: "hello",
    age: 22,
    gender: 0    
}
obj.forEach((value, key, oriObj)=>{
    console.log("输出：", value, key);
})
//console输出如下：
/*VM978:6 Uncaught TypeError: obj.forEach is not a function
    at <anonymous>:6:5
(anonymous) @ VM978:6*/

//查看obj.__proto__.forEach和Object.prototype.forEach
obj.__proto__.forEach
//undefined

Object.prototype.forEach
//undefined

obj.__proto__ === Object.prototype
//true

可以看到Object的原型对象上并没有定义forEach方法。

3.定义适用于object对象的可枚举属性的forEach方法：

//callback:传入forEach的处理每个属性的函数
Object.prototype.forEach = function (callback) {
            let keys= Object.keys(this);//this指向调用该方法的object对象；keys是this指向的object对象的所有可枚举属性的键数组
            for(let i = 0; i < keys.length; i++){//key为键数组中的每一个字符串索引，like '0', '1', '2';
                callback(this[keys[i]], keys[i], this);//keys[key]即键，"name", "age", "gender"；this[keys[key]]即为键对应的值："hello",，22， 0      
            }
        }

4.验证forEach方法是否可行：

obj.forEach((value, key, obj)=>{
            console.log("value = ", value, "key = ", key); 
        })
        
//console输出如下

//VM2918:2 value =  hello key =  name
//VM2918:2 value =  22 key =  age
//VM2918:2 value =  0 key =  gender

可以看出forEach方法现在适用于object对象了，但是注意！！！

这里定义的Object.prototype的forEach不同于Array.prototype.forEach!!!

Array.prototype.forEach
//ƒ forEach() { [native code] }
Object.prototype.forEach
/*ƒ (callback) {
            let keys= Object.keys(this);//this指向调用该方法的object对象；keys是this指向的object对象的所有可枚举属性的键数组
            for(let i = 0; i < keys.length; i++){//key为键数组中的每一个字符串索引，like '0', '1', '2';*/
Array.prototype.forEach === Object.prototype.forEach
//false

5.结论：可以自行定义适用于object对象的forEach方法，但和array对象的forEach方法是不一样的。