首先需要对js有一个基本的认识:
1.js的类:function
function不仅是函数,同时也是“类”。js没有提供class关键字,但是,class又确实是js的关键字。 1、js中的所有对象(指向类实例的空间的指针)都有__proto__属性 (在Firefox新版本(61.0版本下)__proto__属性变成了<prototype>);
2、js中的所有一切都是对象!(也就是说所有东西都有__proto__属性);
3、js中只有function具有prototype属性!因为第2点,所以prototype也是对象,也拥有__proto__属性!
2.js中的函数具有双重性质
第一,函数就是普通的函数,可以被调用,也可以被正常执行;
第二,它将形成一个类,形成一个数据类型,就看自己到底怎么用它,任何一个函数的内部还自己拥有一个构造 函数。
在js中,这种写法:
var funName = function() {
...
};
等价于:
function funName() {
...
};
而,
funName = function() {
};
这种写法前面没有var修饰,其实是给window增加了一个funName成员;
接着,有了上面的基本概念之后,下面看一下在js中new关键字的具体执行过程:
3.new的执行过程
先来看一下下面这段简单的代码:
var Point = function() {
this.row = 3;
this.col = 4;
this.setRow = function(row) {
this.row = row;
};
this.getRow = function() {
return this.row;
};
this.setCol = function(col) {
this.col = col;
};
this.getCol = function() {
return this.col;
};
};
console.log("Point:", Point);
运行结果:
上述代码定义了一个Point类,从执行结果来看Point类里面并没有row、col...这些成员,这一点很重要!!! 紧接着执行下面这两行代码:首先给Point类创建了point1这个对象,紧接着输出这个对象...
var point1 = new Point;//Point后面带或者不带()都是可以的
console.log("point1:", point1);
运行结果:
发现point1里面有大量的键值对(或者说是属性)
在这里有必要分析一下new关键字在js中的执行过程:
分析:new运算符在js中的操作是这样的:
1、new后面必须是类类型;
2、类类型一定有constructor()函数,即,构造函数,new运算符会执行该函数;
3、类类型的构造函数实质上就是类本身(因为类本身就是function);
分析:new的执行过程:
1、申请一个空的Object空间(即,空的对象空间),并将其首地址赋值给其对象point1;
2、以point1为引导,执行其“构造函数”,就是函数(类)本身;
3、在执行构造方法的过程中,this.XXX = ......;这样的语句,相当于给point1增加“属性”!