JavaScript类和继承 constructor属性

constructor属性始终指向创建当前对象的构造函数。比如下面例子:比如下面例子:


代码如下:

// 等价于 var foo = new Array(1, 56, 34, 12);
var arr = [1, 56, 34, 12];
console.log(arr.constructor === Array); // true
// 等价于 var foo = new Function();
var Foo = function() { };
console.log(Foo.constructor === Function); // true
// 由构造函数实例化一个obj对象
var obj = new Foo();
console.log(obj.constructor === Foo); // true
// 将上面两段代码合起来,就得到下面的结论
console.log(obj.constructor.constructor === Function); // true

但是当constructor遇到prototype时,有趣的事情就发生了。
我们知道每个函数都有一个默认的属性prototype,而这个prototype的constructor默认指向这个函数。如下例所示:


代码如下:

function Person(name) {
this.name = name;
};
Person.prototype.getName = function() {
return this.name;
};
var p = new Person("ZhangSan");
console.log(p.constructor === Person); // true
console.log(Person.prototype.constructor === Person); // true
// 将上两行代码合并就得到如下结果
console.log(p.constructor.prototype.constructor === Person); // true

当时当我们重新定义函数的prototype时(注意:和上例的区别,这里不是修改而是覆盖),constructor属性的行为就有点奇怪了,如下示例:


代码如下:

function Person(name) {
this.name = name;
};
Person.prototype = {
getName: function() {
return this.name;
}
};
var p = new Person("ZhangSan");
console.log(p.constructor === Person); // false
console.log(Person.prototype.constructor === Person); // false
console.log(p.constructor.prototype.constructor === Person); // false

为什么呢?
原来是因为覆盖Person.prototype时,等价于进行如下代码操作:


代码如下:

Person.prototype = new Object({
getName: function() {
return this.name;
}
});

而constructor属性始终指向创建自身的构造函数,所以此时Person.prototype.constructor === Object,即是:


代码如下:

function Person(name) {
this.name = name;
};
Person.prototype = {
getName: function() {
return this.name;
}
};
var p = new Person("ZhangSan");
console.log(p.constructor === Object); // true
console.log(Person.prototype.constructor === Object); // true
console.log(p.constructor.prototype.constructor === Object); // true

怎么修正这种问题呢?方法也很简单,重新覆盖Person.prototype.constructor即可:


代码如下:

function Person(name) {
this.name = name;
};
Person.prototype = new Object({
getName: function() {
return this.name;
}
});
Person.prototype.constructor = Person;
var p = new Person("ZhangSan");
console.log(p.constructor === Person); // true
console.log(Person.prototype.constructor === Person); // true
console.log(p.constructor.prototype.constructor === Person); // true

时间: 2010-03-01

Javascript的构造函数和constructor属性

例如,在Chrome下调试如下程序,很清楚的展示了这点: 然而事情并不是这么简单.再看下面的代码: 很显然,这个时候obj的constructor已经不再是创建它的函数,注意到obj.name也是undefined,因此修改构造函数的prototype的contructor并不会影响构造函数所产生的对象.真正的原因是:一个对象的constructor是它的构造函数的prototype.constructor,而每一个函数都有一个prototype,默认情况下,这个prototype有一个cons

不用构造函数(Constructor)new关键字也能实现JavaScript的面向对象

JavaScript中的对象模型(object model)并不广为人知.我曾写过一篇关于他们的博客.之所以不被人所熟知,原因之一就是JavaScript是这些被人广泛使用的语言中唯一一个通过原型(prototype)来实现继承的.但是,我认为另一个原因就是这种对象模型非常复杂,难于解释.它为什么这么复杂并且又令人困惑呢?那是因为JavaScript试图去隐藏它传统的面向对象的特性--最终导致了它的双重人格(译者注:作者意思是JavaScript既有面向过程的特征,又有面向对象的特征). 我认为

JavaScript中的prototype和constructor简明总结

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

js constructor的实际作用分析

复制代码 代码如下: <script> Function.prototype.createInstance = function(){ var T = function(){}; T.prototype = this.prototype; T.constructor = this; var o = new T(); this.apply(o, arguments); return o; }</script> 说下上面代码里面 T.constructor = this这句话,我感觉这

javascript new后的constructor属性

js对象生成时: 如:function BB(a){this.a="kkk"} var b=new BB();这时b是对象有了BB的的属性prototype所指向的prototype对象:prototype对象有constructor属性指向BB这个函数:所以alert(b.constructor==BB.prototype.constructor) //true 这里的"有了"的执行过程是先查看b有没有此属性让后去查看prototype里的属性值,不是简单的A=B

深入分析js中的constructor和prototype

我们在定义函数的时候,函数定义的时候函数本身就会默认有一个prototype的属性,而我们如果用new 运算符来生成一个对象的时候就没有prototype属性.我们来看一个例子,来说明这个 复制代码 代码如下: function a(c){ this.b = c; this.d =function(){ alert(this.b); } } var obj = new a('test'); alert(typeof obj.prototype);//undefine alert(typeof a

javascript设计模式Constructor(构造器)模式

Constructor是一种在内存已分配给该对象的情况下,用于初始化新创建对象的特殊方法.Object构造器用于创建特定类型的对象–准备好对象以备使用,同事接收构造器可以使用参数,以在第一次创建对象时,设置成员属性和方法值. 对象创建 创新新对象,在javascript中通常有两种方法:  1.对象直面量方法 var newObj = {}; 2.构造器的简洁方法 var newObj = new Object(); 在Object构造器为特定的值创建对象封装,或者没有传递值时,它将创建一个肯那

JavaScript constructor和instanceof,JSOO中的一对欢喜冤家

至少每个尝试JavaScriptOO的程序员都花费很多精力用在面向对象机制的模拟上而非业务本身. 这对Java,C++甚至Php的开发者来讲都是难以想象的. 更糟糕的是模拟OO对于JavaScript高级程序员都有着邪恶的吸引. 因为干这个事儿超然于业务之上,有种创造新编程语言一般的快感,可以令IQ尽情挥洒. 正如前些年大家都想把自个网站的common.js写成个框架一样.直到YUI,JQuery等等的强势推出才稍有平息. 然而虽然各个框架都有对JavaScriptOO模拟,但还未到有谁谁谁可以

JavaScript中几个重要的属性(this、constructor、prototype)介绍

this this表示当前对象,如果在全局作用范围内使用this,则指代当前页面对象window: 如果在函数中使用this,则this指代什么是根据运行时此函数在什么对象上被调用. 我们还可以使用apply和call两个全局方法来改变函数中this的具体指向. 先看一个在全局作用范围内使用this的例子: 复制代码 代码如下: <script type=> console.log( === window); console.log(window.alert === .alert); cons

理解Javascript_11_constructor实现原理

constructor是什么 简单的理解,constructor指的就是对象的构造函数.请看如下示例: 复制代码 代码如下: function Foo(){}; var foo = new Foo(); alert(foo.constructor);//Foo alert(Foo.constructor);//Function alert(Object.constructor);//Function alert(Function.constructor);//Function 对于foo.con

深入理解ThreadLocal工作原理及使用示例

简介:本文已一个简要的代码示例介绍ThreadLocal类的基本使用方式,在此基础上结合图片阐述它的内部工作原理. 早在JDK1.2的版本中就提供java.lang.ThreadLocal,ThreadLocal为解决多线程程序的并发问题提供了一种新的思路.使用这个工具类可以很简洁地编写出优美的多线程程序. 当使用ThreadLocal维护变量时,ThreadLocal为每个使用该变量的线程提供独立的变量副本,所以每一个线程都可以独立地改变自己的副本,而不会影响其它线程所对应的副本. 从线程的角

深入理解Spring事务原理

一.事务的基本原理 Spring事务的本质其实就是数据库对事务的支持,没有数据库的事务支持,spring是无法提供事务功能的.对于纯JDBC操作数据库,想要用到事务,可以按照以下步骤进行:  1.获取连接 Connection con = DriverManager.getConnection()  2.开启事务con.setAutoCommit(true/false);  3.执行CRUD  4.提交事务/回滚事务 con.commit() / con.rollback();  5.关闭连接

理解Javascript_07_理解instanceof实现原理

那么instanceof的这种行为到底是如何实现的呢,现在让我们揭开instanceof背后的迷雾. instanceof原理 照惯例,我们先来看一段代码: 复制代码 代码如下: function Cat(){} Cat.prototype = {} function Dog(){} Dog.prototype ={} var dog1 = new Dog(); alert(dog1 instanceof Dog);//true alert(dog1 instanceof Object);//t

iOS中id类型的理解及底层原理详解

前言 id:是一种数据类型: id类型被定义为指向对象的指针,这可以从id的定义中看出.id在objc.h中的定义为: typedef struct objc_object { Class isa; } *id; id是一个一个比较灵活的对象指针,并且是一个指向任何一个继承了Object(或者NSObject)类的对象.而在cocoa的开发环境里,NSObject是所有类的根类.所以id可以指向任何一个cocoa的合法对象. Objective-C中的id这种数据类型存在的价值是什么? id是一

深入理解redis_memcached失效原理(小结)

最近项目上出现了一个无法理解的BUG,用户默认每天享有一定次数的权限,使用完毕则无法享用,第二天才能再继续.本质就是redis缓存过期嘛,让它凌晨12点失效就好了. 但是问题发生了,它就是没失效...深究其原因,竟是由于零界点没处理好的锅,服务器时间与request时间是有些许时间差的,key的expire到了一定数量处理也是需要时间哒,就这俩主因.加个存在判断,失效给他提前个10秒留个准备就好了~ 所以吸取教训,好好了解一下这个失效机理,同时也提醒各位别范这种低级错误.  一.如何才能触发ke

理解vue ssr原理并自己搭建简单的ssr框架

前言 大多数Vue项目要支持SSR应该是为了SEO考虑,毕竟对于WEB应用来说,搜索引擎是一个很大的流量入口.Vue SSR现在已经比较成熟了,但是如果是把一个SPA应用改造成SSR应用,成本还是有些高的,这工作量无异于重构前端.另外对前端的技术要求也是挺高的,需要对Vue比较熟悉,还要有Node.js 和 webpack 的应用经验. 引入 Vue是一个构建客户端应用的框架,即vue组件是在浏览器中进行渲染的.所谓服务端渲染,指的是把vue组件在服务器端渲染为组装好的HTML字符串,然后将它们

理解Javascript_01_理解内存分配原理分析

原始值和引用值 在ECMAScript中,变量可以存放两种类型的值,即原始值和引用值. 原始值指的就是代表原始数据类型(基本数据类型)的值,即Undefined,Null,Number,String,Boolean类型所表示的值. 引用值指的就是复合数据类型的值,即Object,Function,Array,以及自定义对象,等等 栈和堆 与原始值与引用值对应存在两种结构的内存即栈和堆 栈是一种后进先出的数据结构,在javascript中可以通过Array来模拟栈的行为 复制代码 代码如下: va

深入理解javascript中的 “this”

一.前言: 我们知道 "this" 是javascript语言的一个关键字,在编写javascript代码的时候,经常会见到或者用到它. 但是,有一部分开发朋友,对 "this" 一知半解,下面我们就一起来探讨学习下javascript中 "this" 的具体含义吧! 二.This总结: This指针作用域: 1).在全局执行环境中使用this,表示Global对象,在浏览器中就是window对象. 2).当在函数执行环境中使用this时,情况就

JavaScript定时器实现的原理分析

JavaScript中的定时器大家基本在平时的开发中都遇见过吧,但是又有多少人去深入的理解其中的原理呢?下面我们就来分析一下定时器的实现原理. 一.储备知识 在我们在项目中一般会遇见过这样的两种定时器,第一种是setTimeOut,第二种是setInterval,这两种定时器有如下的区别: 1.setTimeout允许设置一个超时对象,超时后执行这个对象,但是只执行一次,无周期 2.setInternval允许设置一个超时对象,超时后执行这个对象,周期等于超时对象指定的时间,周期为无限循环 举一