js 实例、原型、继承

126 阅读1分钟

1.实例对象

通过实例的方式构造出来的对象

  • 构造函数
// 构造函数
function Foo(){

}
//区别:1.首字母大写 2.通过new的方式执行
//在构造函数的内部,将this指向为实例后(new 后)的对象——this
var foo = new Foo() // new实例后,会返回一个对象,定义一个foo来接收。foo(实例对象)

若进行属性绑定

function Foo(){
    this.a = 1 // 此熟悉绑定在了foo上
}
var foo = new Foo()
console.log(foo);

image.png

2.原型对象

所有实例的公共组件。可通过实例对象拿到原型

function Foo(){
    this.a = 1 // 此熟悉绑定在了foo上
}

Foo.prototype = {
    aa: 10
}
// 修改原型后应再实例化一次
var foo = new Foo();
console.log(foo.aa) //10
console.log(foo) // Foo {a:1  _proto_:aa:10}
console.log(foo.__proto__ === Foo.prototype) //访问原型的两种方式,实例.__proto__,构造函数.prototype

3.proto、prototype、constructor

console.log(foo.__proto__ === Foo.prototype)
console.log(Object.prototype === foo._proto_.proto__)

prototype:原型,通过构造函数访问 Foo.protptupe
__proto__:原型,通过实例访问.foo.proto
constructor:原型上的属性,若是重写了原型,则应该定义构造函数constructor

4.理解

如果把构造函数Foo看作是一间屋子,那Foo.prototype就是里面的一间房间,而Foo.prototype房间是由Foo创造出来的。 两者能不能算是包括与被包括的关系?

而object.prototype存在于Foo.prototype房间里面,这就是为什么我们能在构造函数里面直接使用一些基础函数例如toString()?这些基础函数是写在object.prototype里面的吗?儿子所以能顺着血缘关系找到爷爷的基本函数并且用上。