for in循环
实现对象属性和方法的遍历
var obj = {
name:"殷志源",
age:"18",
sex:"man",
height:"180",
weight:75,
test:function(){}
}
for(var prop in obj){
console.log(prop);
}
输出对象中属性名/方法名
要怎么实现输出属性名/方法名对应的值呢?
用console.log(obj.prop);可以吗?
var obj = {
name:"殷志源",
age:"18",
sex:"man",
height:"180",
weight:75,
test:function(){}
}
for(var prop in obj){
console.log(obj.prop);
}
可以看到控制台输出的全是undefined
这是因为obj.prop在执行时系统会在内部将其隐式的转换为obj[‘prop’]。
注:
对象属性有两种表示方法:
<prop为属性名>
1.obj.prop
2.obj[‘prop’]([]中必须为字符串)
转换为obj[‘prop’],系统就会去查找obj对象的一个叫做prop的属性/方法,不存在该属性/方法则输出undefined。
对此说法,可以进行验证,给obj对象添加一个prop属性
var obj = {
name:"殷志源",
age:"18",
sex:"man",
height:"180",
weight:75,
prop:"hi~",
test:function(){}
}
for(var prop in obj){
console.log(obj.prop);
}
由此结果可知,该说法是正确的。
那么要怎么才能用for in循环真正实现对象属性/方法对应值的输出呢?
我们知道对象属性第二种表示方法 obj[‘prop’] 的 [] 中的值必须是属性名的字符串形式,而for in循环中每次的prop值就是属性名的字符串形式
var obj = {
name:"殷志源",
age:"18",
sex:"man",
height:"180",
weight:75,
test:function(){}
}
for(var prop in obj){
console.log(prop);
console.log(typeof prop)
}
故可以使用对象属性的第二种表示方式:
var obj = {
name:"殷志源",
age:"18",
sex:"man",
height:"180",
weight:75,
test:function(){}
}
for(var prop in obj){
console.log(obj[prop])//不要引号,prop本身就是字符串
}
成功输出对象属性/方法对应的值
for in循环除了可以遍历对象以外,也可以遍历数组(数组也算特殊类型的对象)
var arr = ['a','b','c']
for(var prop in arr){
console.log(arr[prop])
}
此时prop是遍历的数组元素的索引位置
操作符
- hasOwnProperty
任何一个对象都有这个方法,用来判断传入的属性\方法名(字符串形式)是不是该对象自身的方法(也可能是原型链上的方法),是自己的返回true,不是则返回false。
给obj对象添加一个__proto__
原型属性,输出obj对象的属性\方法值
var obj = {
name:"殷志源",
age:"18",
test:function(){},
__proto__:{
lastName:'deng'
}
}
for(var prop in obj){
console.log(obj[prop])
}
当不使用hasOwnProperty方法进行筛选时,obj原型的属性也会被输出
使用hasOwnProperty方法进行筛选
var obj = {
name:"殷志源",
age:"18",
test:function(){},
__proto__:{
lastName:'deng'
}
}
for(var prop in obj){
if(obj.hasOwnProperty(prop)){//判断该属性\方法是否是该对象自身的方法
console.log(obj[prop])
}
}
obj的原型属性没有被输出
- in
用来判断对象上能否访问到某属性,而不是判断某属性是否属于该对象自身(hasOwnProperty())
var obj = {
name:"殷志源",
age:"18",
test:function(){},
__proto__:{
lastName:'deng'
}
}
属性名要用字符串形式,非字符串形式的是变量
对象原型上的属性也可以被访问,返回true
-
instanceof
‘A instanceof B’ 官方给出的解释:
判断A对象是不是B构造函数构造出来的function Person(){} var person = new Person();
但我们发现:
很显然person对象不是Object构造函数构造出来的,但结果也是true同样有以下这种情况
这是因为’A instanceof B’ 的本质涵义是判断A对象的原型链上是否有B构造函数的原型(认为A对象原型链上的对象也算是A对象的构造函数)
<person对象的__proto__
属性指向的是其构造函数Person对象的原型对象>
可以看到,person对象的原型链上有其构造函数Person的原型(__proto__
)也有其构造函数Person的原型的构造函数Object的原型(__proto__
),故返回true,person对象的原型链上没有Array的原型,故返回false