视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
JavaScript中的prototype和constructor简明总结_基础知识
2020-11-27 21:21:26 责编:小采
文档


一、constructor
constructor的值是一个函数。在JavaScript中,除了null和undefined外的类型的值、数组、函数以及对象,都有一个constructor属性,constructor属性的值是这个值、数组、函数或者对象的构造函数。如:
代码如下:var a = 12, // 数字
b = 'str', // 字符串
c = false, // 布尔值
d = [1, 'd', function() { return 5; }], // 数组
e = { name: 'e' }, // 对象
f = function() { return 'function'; }; // 函数

console.log('a: ', a.constructor); // Number()
console.log('b: ', b.constructor); // String()
console.log('c: ', c.constructor); // Boolean()
console.log('d: ', d.constructor); // Array()
console.log('e: ', e.constructor); // Object()
console.log('f: ', f.constructor); // Function()

以上的构造函数都是JavaScript内置的,我们也可以自定义构造函数,如:
代码如下:
function A(name) {
this.name = name;
}

var a = new A('a');

console.log(a.constructor); // A(name)

调用构造函数时,需要用new关键字,构造函数返回的是一个对象,看下面的代码就知道了:
代码如下:var a = 4;
var b = new Number(4);

console.log('a: ', typeof a); // a: number
console.log('b: ', typeof b); // b: object

二、 prototype
prototype是函数的一个属性,默认情况下,一个函数的prototype属性的值是一个与函数同名的空对象,匿名函数的prototype属性名为Object。如:
代码如下:function fn() {}

console.log(fn.prototype); // fn { }

prototype属性主要用来实现JavaScript中的继承,如:
代码如下:function A(name) {
this.name = name;
}

A.prototype.show = function() {
console.log(this.name);
};

function B(name) {
this.name = name;
}

B.prototype = A.prototype;

var test = new B('test');

test.show(); // test

这儿有一个问题,test的构造函数其实是A函数而不是B函数:
代码如下:console.log(test.constructor); // A(name)

这是因为B.prototype = A.prototype把B.prototype的构造函数改成了A,所以需要还原B.prototype的构造函数:
代码如下:function A(name) {
this.name = name;
}

A.prototype.show = function() {
console.log(this.name);
};

function B(name) {
this.name = name;
}

B.prototype = A.prototype;
B.prototype.constructor = B;

var test = new B('test');

test.show(); // test
console.log(test.constructor); // B(name)

之所以要这么做,是因为prototype的值是一个对象,且它的构造函数也就是它的constructor属性的值就是它所在的函数,即:
代码如下:console.log(A.prototype.constructor === A); // true

下载本文
显示全文
专题