JS基础知识整理 —— 对象的枚举(循环遍历)

380 阅读2分钟
【数组遍历(for循环)】

var arr = [1,2,3,4,5,6,7,8,9,10];
for(var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}

【对象遍历(for in 循环)】

var obj = {
    aa: 'aaa',
    bb: 'bbb',
    cc: 'ccc',
    dd: 'ddd',
    ee: 'eee'
}
for(var prop in obj) {//相当于每次循环把obj的属性放进prop里面
    console.log(prop + ":" + typeof prop);
    console.log(obj.prop); //打印5个undefined,因为obj.prop==>obj['prop'],这里把prop当作属性,而不是当作变量了,而obj是没有prop属性的,所以就打印undefined;
    console.log(obj[prop]); //此时prop才表示变量,每次访问的时候就是prop对应的值,这样才能正常访问到obj的属性
}

//这里prop可以随便写,也可以用key,var prop也可以提到for in循环外面

//在for in循环里面访问属性值只能用obj[prop]这种形式

//for in循环可以返回原型及原型链上的东西,可以打印自己设的__proto__,但是系统自带的__proto__是不会打印的(查找到Object.prototype终端的时候)


1. hasOwnProperty(判断是否是对象自己的属性【不包括原型和原型链上继承的属性】)

调用:hasOwnProperty(prop)返回值:truefalse
var obj = {
    aa: 'aaa',
    bb: 'bbb',
    cc: 'ccc',
    dd: 'ddd',
    ee: 'eee',
    __proto__: {
        xx: 'xxx'
    }
}

for(var prop in obj) {//相当于每次循环把obj的属性放进prop里面,一般for in循环里面都会加个hasOwnProperty添加判断下
    if(obj.hasOwnProperty(prop)){
        console.log(obj[prop]); //aaa, bbb, ccc, ddd, eee,不会打印__proto__
    }
}

2. in(判断是否是对象自己的属性【包括原型和原型链上继承的属性,即是所有属性】,这是和 hasOwnProperty的区别)

调用:prop in obj返回值:truefalse


3. instanceof

调用:A instanceof B(判断A对象是不是B构造函数构造出来的【官方解释】)
其实质:看A对象的原型链上有没有B的原型

function Person() {
}
var person = new Person();
person instanceof Person //true
person instanceof Object //true

[] instanceof Array //true
[] instanceof Object //true


运用:判断是数组还是对象
【方法一:利用constructor】
var array = [];
array.constructor; //function Array() {}

var obj = {};
obj.constructor; //function Object() {}

【方法二:利用instanceof】==》当页面有子页面时,array instanceof Array会显示false【父子域】
var array = [];
array instanceof Array; // true

var obj = {};
obj instanceof Array; //false;

【方法三:toString】推荐使用方法三
var array = [];
array.toString(); // ''

var obj = {};
obj.toString; //'[object Object]'
或者:
Object.prototype.toString.call(array); //'[object Array]'