回归JavaScript基础(十)
主题:创建对象
原型模式
JavaScript中的每个对象都有一个prototype属性(原型属性),这个属性是一个指针,指向一个对象,而这个对象可以由一些属性和方法组成。被指向的对象,可以是多个对象的原型,这样创建的对象就共享了一个原型对象。
function Person() {
}
Person.prototype.name = "xuchaoi";
Person.prototype.age = 24;
Person.prototype.sayName = function() {
alert(this.name);
};
var person1 = new Person();
var person2 = new Person();
alert(person1.name === person2.name); //true
这里可提炼一下,用更简洁的方式实现。但需要注意contructor属性的变化!
function Person() {
}
//注意:用下面的方式的话Person.prototype的contructor属性就指向对象{...}了,这里通过设置contructor属性去除不想要的结果
Person.prototype = {
contructor: Person,
name: "xuchaoi",
age: 24,
sayName: function() {
alert(this.name);
};
var person1 = new Person();
var person2 = new Person();
alert(person1.name === person2.name); //true
但这种模式存在一个很大的缺点,若共享的属性中存在引用类型,就会存在一个对象该属性修改后,所有对象的该属性都被修改。
function Person() {
}
Person.prototype.name = "xuchaoi";
Person.prototype.friends = ["小明","小红"];
Person.prototype.sayName = function() {
alert(this.name);
};
var person1 = new Person();
var person2 = new Person();
person1.friends.push("小王");
alert(person2.friends); //"小明,小红,小王"
为了解决这个问题,我们可以把构造函数与原型模式进行组合使用。不能共享的属性放在构造函数中,原型模式中放一些共享的属性。这是目前JavaScript中使用最为广泛、认可度最高的一种创建自定义类型的方式。
function Person(name, age) {
this.name = name;
this.age = age;
this.friends = ["小红", "小明"];
}
Person.prototype = {
contructor : Person,
sayName : function() {
alert (this.name);
}
}
var person1 = new Person("xu1", 20);
var person2 = new Person("xu2", 21);
person1.friends.push("小王");
alert(person1.friends); //"小红,小明,小王"
alert(person2.friends); //"小红,小明"
此外还有:
寄生构造函数模式(函数内部封装一个创建对象过程,然后再返回这个创建的对象)
function Person(name, age) {
var o = new Object();
o.name = name;
o.age = age;
o.sayName = function() {
alert(this.name);
};
return o;
}
var person1 = new Person("xuchaoi", 20);
person1.sayName(); //"xuchaoi"
稳妥构造函数模式(类似于寄生构造函数模式,但构造函数内部的创建对象过程中不使用this,不使用new来调用构造函数)
function Person(name, age) {
var o = new Object();
o.name = name;
o.age = age;
o.sayName = function() {
alert(name);
};
return o;
}
var person1 = Person("xuchaoi", 20);
person1.sayName(); //"xuchaoi"
回归JavaScript基础(十)的更多相关文章
- 回归JavaScript基础(六)
主题:引用类型Date.RegExp的介绍. 上节主要主要介绍了Object.Array引用类型.这节将继续为大家介绍引用类型,并对书中的一些知识点进行总结与归纳,也借此巩固自己对JavaScript ...
- 回归JavaScript基础(一)
主题:JavaScript简介. 一.JavaScript的起源 JavaScript诞生于1995年.当时,它的主要作用是处理一些输入验证操作.之前的话,都是把表单数据发送到服务器端,然后再去判断有 ...
- 回归JavaScript基础(九)
主题:理解对象,创建对象. 小明是一名程序猿,也是一条单身狗!他常常自嘲:每天都会有很多对象,但却没有女朋友! 多么痛的领悟.哈哈,目前比较流行的编程语言都是面向对象的语言(Object-Orient ...
- 回归JavaScript基础(八)
主题:引用类型包装类.单体内置对象的介绍. 对于我们开发人员来说,JavaScript有种引用类型一定很陌生!那就是基本包装类型:Boolean.Number和String.这也不是我们的错,主要这些 ...
- 回归JavaScript基础(七)
主题:引用类型Function的介绍. 今天首先说的就是Function类型.下面就是定义函数的两种方法,第一种使用函数声明语法定义,第二种使用函数表达式定义.这两种定义函数的方式几乎没有什么区别. ...
- 回归JavaScript基础(五)
主题:介绍引用类型Object.Array. 在上一章中,作者就在说变量的值的时候,提到过引用类型这个概念.JavaScript中存在基本类型和引用类型,其中引用类型很重要,这里有许多我们需要注意的东 ...
- 回归JavaScript基础(四)
主题:JavaScript变量.作用域和内存问题 JavaScript的变量和别的语言比起来是与众不同的.说道变量,不得不谈他的作用域.同很多语言一样,JavaScript开发者也不用担心开发中内存的 ...
- 回归JavaScript基础(三)
主题:JavaScript基本概念. 任何语言的核心必然会描述这门语言最基本的工作原理.这部分内容对我们来说,读起来很乏味,甚至会产生困意,但这部分内容却是重要的!我有幸拜读<JavaScrip ...
- 回归JavaScript基础(二)
主题:在HTML中使用JavaScript. 要想把JavaScript放到网页中,就必须涉及到Web的核心语言HTML.向HTML页面中插入JavaScript的主要方法,就是使用<scrip ...
随机推荐
- GO入门——5. 函数
1 函数 Go 函数 不支持 嵌套.重载和默认参数 定义函数使用关键字 func,且左大括号不能另起一行 函数也可以作为一种类型使用 无需声明原型 不定长度变参 func A(a string,c . ...
- 数据库设计 Step by Step (2)——数据库生命周期
引言:数据库设计 Step by Step (1)得到这么多朋友的关注着实出乎了我的意外.这也坚定了我把这一系列的博文写好的决心.近来工作上的事务比较繁重,加之我期望这个系列的文章能尽可能的系统.完整 ...
- 2015年第六届蓝桥杯C/C++程序设计本科B组决赛 完美正方形
完美正方形 如果一些边长互不相同的正方形,可以恰好拼出一个更大的正方形,则称其为完美正方形.历史上,人们花了很久才找到了若干完美正方形.比如:如下边长的22个正方形 2 3 4 6 7 8 12 13 ...
- Flutter踩坑日记:Tab导航栏保持子页面状态
最近应邀票圈小伙伴躺坑Flutter,项目初步雏形完结.以原来的工具链版本为基础做了Flutter版本,不过后面还是需要优化下项目接入Redux,以及扩展一些Native方法. 这里记录一下在开发过程 ...
- eclise linux c mysql
- JavaScript 总结(前端常用工具类的封装)
JavaScript (class是ES6的新东西,看着不爽可以变,但主要还是里面的方法) 1. type 类型判断 class TypeFn { isString (o) { //是否字符串 ret ...
- Jmeter接口测试动态传参——动态获取token值
先添加一个线程组,然后在线程组下添加HTTP Request 环境变量: 线程组下添加User Defined Variables 调用变量:${变量名} 添加结果树: 记录登录后的token: 获取 ...
- 在window环境下挂载mysql数据卷
1.提前在指定的目录下创建一个my.cnf文件,目录名最好为英文且不带特殊符号和空格,文件内容如下,注意:粘贴时要把每一行末尾的空格去除,否则运行时会报错说utf8编码错误 [mysqld] user ...
- 34.Linux-printk分析、使用__FILE__, __FUNCTION__, __LINE__ 调试
本节学习目的 1)分析printk()函数 2)使用printk()调试驱动 1.在驱动调试中,使用printk(),是最简单,最方便的办法 当uboot的命令行里的“console=tty1”时,表 ...
- 排查CentOS7.0的联网情况
1.ifconfig命令. 查看网络配置是否有问题 在/etc/sysconfig/network-scripts/ifcfg-ens33里面配置好网络,记住onboot=on这个选项一定要设置,不然 ...