javascript --- 使用语法糖class定义函数

本文讨论的是通过class声明的函数,有什么特点,或者说是指向了哪里.

class A() {}    // A是一个类// 要看class声明的函数指向哪里,只需将其[[Prototype]]属性打印到控制台,下面看看A和它的原型对象的指向
//  注:[[Prototype]]属性通过__proto__访问
console.log(A.__proto__);
console.log(A.prototype.__proto__);

在这里插入图片描述
可以看见,第一个是Function的原型对象,第二个是Object的原型对象.
即有下面等式,

A.__proto__ === Function.prototype
A.prototype.__proto__ === Object.prototype// 验证如下:
console.log(A.__proto__ === Function.prototype);
console.log(A.prototype.__proto__ === Object.prototype);

在这里插入图片描述
可以看出,通过class声明的函数其构造函数(A)是指向函数的原型对象(Function.prototype)
其原型对象(A.prototype)是指向对象的原型对象的(Object.prototype)

在看看通过function声明的函数有啥特点:

function A() {}  
console.log(A.__proto__ );
console.log(A.prototype.__proto__ );
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190502111240732.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3BpYW5vOTQyNQ==,size_16,color_FFFFFF,t_70)
可以看见.使用class和 function声明函数时,其构造函数,和原型对象的指向是一样的.

在看看class和function声明的构造函数生成的实例:

function A() {}  
class B	{}
var a = new A();
var b = new B();
console.log(a);
console.log(b);

在这里插入图片描述
可以看见,实例a的[[Prototype]]属性是指向A的原型函数A.prototype. (constructor:f A())
实例b的[[Prototype]]属性是指向B的原型B.prototype. (constructor: class B)
A的原型对象的[[Prototype]]属性指向Object的原型对象
B的原型对象的[[Prototype]]属性指向Object的原型对象

// 验证如下
console.log(a.__proto__ === A.prototype);
console.log(b.__proto__ === B.prototype);
console.log(A.prototype.__proto__ === Object.prototype);
console.log(B.prototype.__proto === Object.prototype);

在这里插入图片描述
由此可见,在使用new操作符时(例如:var a = new A()),实际上是生成一个名字为a的对象,
a的[[Prototype]]属性是指向A的原型.从而a可以使用A原型上定义的属性和方法,