JavaScript中的prototype和constructor简明总结

 一直没弄清楚JavaScript中的prototype和constructor属性,今天看了看书,总算有点眉目了

一、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
 

时间: 2024-09-17 04:41:08

JavaScript中的prototype和constructor简明总结的相关文章

JavaScript中的prototype和constructor简明总结_基础知识

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

JavaScript中String.prototype用法

  本文实例讲述了JavaScript中String.prototype用法.分享给大家供大家参考.具体如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 // 返回字符的长度,一个中文算2个 String.prototype.ChineseLength=function() { return this.replace(/[^x00-xff]/g,"**").len

JavaScript中通过prototype属性共享属性和方法的技巧实例

 这篇文章主要介绍了JavaScript中通过prototype属性共享属性和方法的技巧实例,本文直接给出一个代码实例,需要的朋友可以参考下     具体代码如下:   代码如下: //定义函数 function people(name,sex,age){ this.name = name; this.sex = sex; this.age = age; } //共享isStudent与sayName方法 people.prototype = { isStudent:true, sayName:

JavaScript中Object.prototype.toString方法的原理_javascript技巧

在JavaScript中,想要判断某个对象值属于哪种内置类型,最靠谱的做法就是通过Object.prototype.toString方法. var arr = []; console.log(Object.prototype.toString.call(arr)) //"[object Array]" 本文要讲的就是,toString方法是如何做到这一点的,原理是什么. ECMAScript 3 在ES3中,Object.prototype.toString方法的规范如下: 15.2.

JavaScript中String.prototype用法实例_javascript技巧

本文实例讲述了JavaScript中String.prototype用法.分享给大家供大家参考.具体如下: // 返回字符的长度,一个中文算2个 String.prototype.ChineseLength=function() { return this.replace(/[^\x00-\xff]/g,"**").length; } // 判断字符串是否以指定的字符串结束 String.prototype.EndsWith = function(str) { return this.

JavaScript中的prototype(原型)属性研究

javascript 我们知道Jscript中对象的prototype属性,是用来返回对象类型原型的引用的.我们使用prototype属性提供对象的类的一组基本功能.并且对象的新实例会"继承"赋予该对象原型的操作.但是这个prototype到底是怎么实现和被管理的呢? 对于对象的prototype属性的说明,Jscript手册上如是说:所有 Jscript 内部对象都有只读的 prototype 属性.可以向其原型中动态添加功能(属性和方法),但该对象不能被赋予不同的原型.然而,用户定

JavaScript中的prototype使用说明_javascript技巧

1.prototype 在JavaScript中并没有类的概念,但JavaScript中的确可以实现重载,多态,继承.这些实现其实方法都可以用JavaScript中的引用和变量作用域结合prototype来解释. 2.简单的例子 复制代码 代码如下: var Blog = function( name, url ){ this.name = name; this.url = url; }; Blog.prototype.jumpurl = ''; Blog.prototype.jump = fu

JavaScript中的prototype原型学习指南_基础知识

原型是什么 Function 类型有一个属性 prototype,直接翻译过来就是原型.这个属性就是一个指针,指向一个对象,这个对象包含一些属性和方法,这些属性和方法会被当前函数生成的所有实例(对象)所共享. 这句话根据前面所说的,细细琢磨下来,就可以得到下面代码: function Person(){ ... } Person.prototype = { country : 'china', sayName : function(){ ... } } 先创建了一个 Function 类型的实例

js中的prototype和constructor

1.js中只有对象,包括对象,函数,常量等. 对象不用解释.函数也有属性,常见之一就是prototype.常量也有属性: (3).__proto__;//Number {} 2.函数的prototype 函数是一种特殊的对象,它可以直接通过小括号来执行自身代码. 函数还有一个特殊的属性prototype,它也是一个对象. prototype对象也有一个特殊的属性constructor,初始的时候它是指向该函数的. 也就是当js解释到function关键字的时候,会创建两个对象,一个是functi