JavaScript之面向对象学习三原型语法升级
1、到目前为止,我们是时候分析下前面的使用原型语法来定义对象有哪些不足的地方,代码如下:
function Person(){
}
Person.prototype.name="张三";
Person.prototype.age=22;
Person.prototype.job="coder";
Person.prototype.sayName=function(){
alert(this.name);
}
当我们为Person对象每添加一个属性和方法,就要敲一遍Person.prototype,而且Person.prototype没有体现出封装性;
所以下面来改进原型语法,代码如下:
function Person(){
}
Person.prototype={
name:"张三",
age:22,
job:"coder",
sayName:function(){
alert(this.name);
}
}
改进之后的原型语法将Person.prototype设置为等于一个以对象字面量形式创建的新对象。最终的结果相同,但有一个列外:constrcutor属性不再指向Person了。
因为当我们每创建一个函数,同时就会创建一个prototype属性对象(原型属性对象),而这个对象会自动获得constructor属性。
而我们在这里使用的语法,本质上完全重写了默认的prototype属性对象,因此constructor属性也就变成了新对象的constuctor属性(该属性指向Object构造函数),不在指向Person函数,所以尽管instanceof操作符还能返回正确的结果,但通过constructor属性来确定对象的类型已经不可能了,如下代码可以说明:
function Person(){
}
Person.prototype={
name:"张三",
age:22,
job:"coder",
sayName:function(){
alert(this.name);
}
}
var person=new Person();
alert(person instanceof Object); //输出:true 因为person是Object的实例(Object是所有类的基类)
alert(person instanceof Person); //输出:true 因为person是Person的实例
alert(person.constructor==Object);
alert(person.constructor==Person); //输出false 说明Person构造函数的Person.prototype属性对象(原型对象)内的constructor属性已经不指向Person函数,而
//是指向Object函数
如果constructor属性真的很重要,我们可以向下面代码那样将它设回适当的值,代码如下:
function Person(){
}
Person.prototype={
constructor:Person, //自定义添加constructor属性,并让他指向Person函数
name:"张三",
age:22,
job:"coder",
sayName:function(){
alert(this.name);
}
}
var person=new Person();
alert(person instanceof Object); //输出:true 因为person是Object的实例(Object是所有类的基类)
alert(person instanceof Person); //输出:true 因为person是Person的实例
alert(person.constructor==Object); //输出:false; 原因如下
alert(person.constructor==Person); //输出:true constructor:Person,=》在对象里面自定义了constructor属性,并让它指向了Person函数
// 所以person.constructor重新指向了Person,而不是Object
注意:以上这种方式添加constructor属性会导致它的[[Enumerable]]设为true,而原生的constructor属性是不可枚举的,所以我们需要用ECMAScript 5中定义的Object.definePropery()方法来重新定义constructor属性,使他变成不可枚举的属性,且值是指向对象构造函数的指针,代码如下:
function Person(){
}
Person.prototype={
name:"张三",
age:22,
job:"coder",
sayName:function(){
alert(this.name);
}
}
Object.defineProperty(Person.prototype,"constructor",{
enumerable:false,
value:Person
});
JavaScript之面向对象学习三原型语法升级的更多相关文章
- JavaScript之面向对象学习七(动态原型模式、寄生构造函数模式、稳妥构造函数模式创建自定义类型)
一.动态原型模式 在面向对象学习六中的随笔中,了解到组合构造函数模式和原型模式创建的自定义类型可能最完善的!但是人无完人,代码亦是如此! 有其他oo语言经验的开发人员在看到独立的构造函数和原型时,很可 ...
- 【JAVASCRIPT】React学习-JSX 语法
摘要 react 学习包括几个部分: 文本渲染 JSX 语法 组件化思想 数据流 JSX 语法 1. 定义 JSX 是javascript + xml 的合集,我们可以将javascript 与 ht ...
- JavaScript之面向对象学习一
1.通过Object构造函数和对象字面量来创建对象缺点:使用同一个接口创建很多的对象,会产生大量的重复代码.比如我需要创建人的对象,并且需要三类人,医生.工程师.老师,他们可以抽象出很多属性,比如姓名 ...
- JavaScript之面向对象学习八(继承)
简介:继承是OO语言中的一个最为人津津乐道的概念.许多OO语言都支持两种继承方式:接口继承和实现继承.接口继承只继承方法签名,而实现继承则继承实际的方法. 但是JS的函数并没有签名,所以在ECMASc ...
- JavaScript之面向对象学习六原型模式创建对象的问题,组合使用构造函数模式和原型模式创建对象
一.仔细分析前面的原型模式创建对象的方法,发现原型模式创建对象,也存在一些问题,如下: 1.它省略了为构造函数传递初始化参数这个环节,结果所有实例在默认的情况下都将取得相同的属性值,这还不是最大的问题 ...
- JavaScript之面向对象学习五(JS原生引用类型Array、Object、String等等)的原型对象介绍
1.原型模式的重要性不仅仅体现在创建自定义类型方面,就连所有的原生的引用类型(Obejct.Array.String等等)都在构造函数的原型上定义方法和属性.如下代码可以证明: alert(typeo ...
- JavaScript之面向对象学习四原型对象的动态性
1.由于在原型中查找值的过程是一次搜索,因此我们对原型对象所做的任何修改都能够立即从实例上反映出来---即便是先创建了实例后修改原型也是如此.代码如下: function Person(){ } va ...
- JavaScript之面向对象学习二(原型属性对象与in操作符)获取对象中所有属性的方法
1.原型属性对象于in操作符之in单独使用 有两种方式使用in操作符:单独使用和在for-in循环中使用.在单独使用中,代码如下: function Person(){ } Person.protot ...
- 治愈 JavaScript 疲态的学习计划【转载】
来源:伯乐在线 - Rose Wang 像其他人一样,最近我读了 Jose Aguinaga 的文章 <How it feels to learn JavaScript in 2016>. ...
随机推荐
- POJ 2429 GCD & LCM Inverse(Pollard_Rho+dfs)
[题目链接] http://poj.org/problem?id=2429 [题目大意] 给出最大公约数和最小公倍数,满足要求的x和y,且x+y最小 [题解] 我们发现,(x/gcd)*(y/gcd) ...
- 【Daily】 2014-4-23
KEEP GOING Think more product when face difference Check value null when insert/remove/update/add ch ...
- poj3006---素数筛法
#include <stdio.h> #include <stdlib.h> ];//以后都用宏定义 MAX int main()//如要将包括1000000在内的打表,数组就 ...
- overfitting
当模型复杂度上升时,可控制参数变多,VC dimension变大, 当VC dimension过大时,虽然Ein很小,但是Eout很大,产生overfitting 比喻:开车 开太快 ...
- Linux学习之第十九、条件判断
原文地址:http://vbird.dic.ksu.edu.tw/linux_basic/0340bashshell-scripts_4.php 条件判断式 只要讲到『程序』的话,那么条件判断式,亦即 ...
- [置顶] 【IOS】IOS7 UI适配
昨天下了把手机升级成了IOS7 正式版,然后下了最新的xocde5. 试着编译了一下刚刚完成的几个应用,还好问题不大,半个小时的时间都适配好了,然后改了下几个新出现的warning.过几天等空了,要 ...
- C# 学习笔记 C#基础
今天第一天开通博客.恰好在学习C#,所以就准备把学到的知识要点记录下来. 基础类型 类型定义了值得蓝图.值是一个被变量或者常量所指定的存储位置,变量是指可以被改变的,而常量则相反,其值不可以便改变, ...
- wcf系列学习5天速成——第五天 服务托管
今天是系列的终结篇,当然要分享一下wcf的托管方面的知识. wcf中托管服务一般有一下四种: Console寄宿: 利于开发调试,但不是生产环境中的最佳实践. winform寄 ...
- 前端新人学习笔记-------html/css/js基础知识点(三)
这断时间家里有点事,上班也有点任务,所以几天没看视频没来更新了.今天来更新一下了. 一:默认样式重置 但凡是浏览默认的样式,都不要使用. body,p,h1,h2,h3,h4,h5,h6,dl,dd{ ...
- bootstrap注意事项(三)
1.<code> 标签用于表示计算机源代码或者其他机器可以阅读的文本内容.软件代码的编写者已经习惯了编写源代码时文本表示的特殊样式.<code> 标签就是为他们设计的.包含在该 ...