JavaScript原型对象2-原型有关的属性和方法

187 阅读3分钟

二、与原型有关的几个属性和方法

2.1、prototype属性

prototype存在于构造函数中(其实任意函数中都有,只是不是构造函数的时候prototype我们不关注而已),

他指向了这个构造函数的原型对象

2.2、constructor属性

constructor属性存在于原型对象中,他指向了构造函数

function Person() {

}

console.log(Person.prototype.constructor === Person)    //true

var p1 = new Person()

//使用instanceof操作符可以判断一个对象的类型
//typeof一般用来获取简单类型和函数。而引用类型一般使用instanceof
//因为引用类型用typeof总是返回object

console.log(p1 instanceof Person)    //true

我们根据需要,可以将Person.prototype属性指向新的对象,来作为Person的原型对象。 但是这个时候有个问题,新的对象的constructor属性则不再指向Person构造函数了,而是Object

看下面代码
function Person() {

}

Person.prototype = {
    name:"linzx",
    age:20
}

var p1 = new Person()
console.log(p1.name)    //linzx

console.log(p1 instanceof Person)    //true
console.log(Person.prototype.constructor === Person)    //false
console.log(Person.prototype.constructor === Object)    //true

//如果constructor对你很重要,你应该在Person.prototype中添加一行这样的代码
/*
    Person.prototype = {
        ...
        constructor: Person        //让constructor重新指向Person函数
    }
*/

2.3、__proto__属性

用构造方法创建一个新的对象之后,

这个对象会有__proto__属性指向了构造方法的原型对象

代码
function Person(){

}

Person.prototype = {
    constructor: Person,
    name: "linzx"
    age: 20
}

var p1 = new Person()

console.log(p1.__proto__ === Person.prototype)        //true

2.4、hasOwnProperty()方法

大家知道,我们去访问一个对象的属性的时候,

这个属性既有可能来自对象本身,也有可能来自这个对象__proto__尚需经指向的原型

那么如何判断这个对象的来源呢?

hasOwnProperty方法,可以判断一个属性是否来自对象本身

代码
function Person() {

}

Person.prototype.name = "linzx"
var p1 = new Person()
p1.sex = "女"

console.log('sex属性是对象本身的: ' + p1.hasOwnProperty('sex'))
console.log('name属性是对象本身的: ' + p1.hasOwnProperty('name'))
console.log('age属性是对象本身的: ' + p1.hasOwnProperty('age'))

所以通过hasOwnProperty这个方法可以判断一个对象是否在对象本身添加的,

但是不能判断是否存在于原型中,因为有可能这个属性不存在 也就是说,在原型中的属性和不存在的属性都会返回false

如何判断一个属性是否存在于原型中呢?

2.5、in操作符

in操作符用来判断一个属性是否存在于这个对象中。

但是在查找这个属性的时候,先在对象本身中找,如果找不到再去原型中找。

换句话说,只要对象和原型中有一个地方存在这个属性,就返回true

代码1
function Person(){}

Person.prototype.name = "linzx"
var p1 = new Person()

p1.sex = "女"
console.log("sex" in p1)    //对象本身添加的  true
console.log("name" in p1)    //原型中存在 true
console.log('age' in p1)    //对象和原型中都不存在 false

回到前面的问题,如何判断一个属性是否存在于原型中 如果一个属性存在,但是没有在对象本身中,则一定存在于原型中

代码2
function Person() {}

Person.prototype.name = 'linzx'
var p1 = new Person()
p1.sex = '男'

//定义一个函数去判断原型所在的位置
function propertyLocation(obj, prop) {
    if(!(prop in obj)){
        console.log(prop + '属性不存在')
    } else if(obj.hasOwnProperty(prop)) {
        console.log(prop + '属性存在于对象中')
    } else {
        console.log(prop + '属性存在于原型中')
    }
}

propertyLocation(p1, 'age')
propertyLocation(p1, 'name')
propertyLocation(p1, 'sex')