JS面向对象设计-创建对象
Object构造函数和对象字面量都可以用来创建单个对象,但是在创建多个对象时,会产生大量重复代码.
1.工厂模式
工厂模式抽象了创建具体对象的过程.由于ECMAScript无法创建类,我们用函数来封装以特定接口创建对象的细节.
function createPerson(name, age, job) {
var o = new Object();
o.name = name;
o.age = age;
o.job = job;
o.sayName = function() {
console.log(this.name);
}
return o;
}
// 根据接收到的参数,构建一个包含三个属性一个方法的对象,并返回
var person1 = createPerson("zhu", 26, "FE");
ps. 工厂模式解决了创建多个相似对象的问题,却无法识别对象(对象的类型)
2.构造函数模式
用来创建特定类型的对象,比如Object/Array这样的原生构造函数,或者自定义构造函数(可以自定义对象类型的属性和方法).
/* 1.没有显示创建对象
* 2.直接将属性和方法赋值给this对象
* 3.没有return语句
* 4.首字母大写(区别于ECMAScript中其他函数,构造函数本身也是函数,只不过可以创建对象)
*/
function Person(name, age, job) {
this.name = name;
this.age = age;
this.job = job;
this.sayName = function() {
console.log(this.name);
}
}
// 必须使用new操作符
var person1 = new Person("zhu", 26, "FE");
var person2 = new Person("liu", 23, "JAVA");
2.1 调用该总种构造函数会经历四个步骤
- 创建一个新对象
- 将构造函数的作用域赋给新对象(因此this就指向了这个新对象)
- 执行构造函数中的代码(为这个新对象添加属性)
- 返回新对象
2.2 对象类型
person1,person2分别保存着Person的一个不同实例,两个对象都有constructor(构造函数)属性指向Person.
person1.constructor == Person, person2.constructor == Person // true
person1,person2既是Object实例也是Person实例.
// 所有对象均继承自Object
person1 instanceof Object, person1 instanceof Person // true
person2 instanceof Object, person2 instanceof Person // true
ps. 创建自定义构造函数意味着可以将它的实例标识为一种特定的类型.
2.3 将构造函数当作函数
构造函数与普通函数的区别在于调用它们的方式不同,只要通过new操作符调用,它就可以作为构造函数.
// 当作构造函数使用,使用new操作符来创建一个新对象.
var person = new Person("zhu", 26, "FE");
person.sayName();
// 作为普通函数调用,属性和方法都被添加到window对象.
// 在全局作用域中调用一个函数时,this对象总是指向Global对象(在浏览器中就是window对象)
Person("zhu", 26, "FE");
window.sayName();
// 使用call()或者apply()在某个特定对象的作用域中调用
var o = new Object();
Person.call(o, "zhu", 26, "FE");
o.sayName();
ps. 构造函数模式定义的构造函数是定义在Global对象中的.
2.4 构造函数的问题
每个方法都要在每个实例上重新创建一遍,person1和person2的同名sayName方法不是同一个function的实例.
ps. ECMAScript的函数是对象,因此每定义一个函数,也就实例化一个对象.即每个Person实例都包含一个不同function实例.
// 逻辑上的构造函数可以这样定义
function Person(name, age) {
this.name = name;
this.age = age;
this.sayName = new function() {
console.log(this.name);
}
}
没有必要创建两个完成同样任务的function实例,然而将sayName提到全局虽然解决做同一件事的问题,但是实际上只能被某个对象调用,而且可能需要定义很多全局函数(无封装性).
JS面向对象设计-创建对象的更多相关文章
- js面向对象设计之class继承
EcmaScript 2015 (又称ES6)通过一些新的关键字,使类成为了JS中一个新的一等公民.但是目前为止,这些关于类的新关键字仅仅是建立在旧的原型系统上的语法糖,所以它们并没有带来任何的新特性 ...
- js面向对象设计之class类
class 相对 function 是后出来的,既然 class 出来了,显然是为了解决 function 在处理面向对象设计中的缺陷而来.下面通过对比,来看看 class 作为 ES6 中的重大升级 ...
- js面向对象设计之function类
本文仅探讨如何合理的使用 function 在 javascript中实现一个面向对象设计的类.总所周知,javascript 并不能实现一个真正意义上的类,比如 protect 比如 函数重载.下面 ...
- js面向对象 多种创建对象方法小结
转自js面向对象 多种创建对象方法小结 1.对象字面量 var clock={ hour:12, minute:10, second:10, showTime:function(){ alert(th ...
- 浅谈JS面向对象之创建对象
hello,everybody,今天要探讨的问题是JS面向对象,其实面向对象呢呢,一般是在大型项目上会采用,不过了解它对我们理解JS语言有很大的意义. 首先什么是面向对象编程(oop),就是用对象的思 ...
- js面向对象、创建对象的工厂模式、构造函数模式、原型链模式
JS面向对象编程(转载) 什么是面向对象编程(OOP)?用对象的思想去写代码,就是面向对象编程. 面向对象编程的特点 抽象:抓住核心问题 封装:只能通过对象来访问方法 继承:从已有对象上继承出新的对象 ...
- js面向对象之创建对象
工厂模式 function createPerson(name,age,job){ var o = new Object(); o.name = name; o.age = age; o.job = ...
- 读Javascript高级程序设计第三版第六章面向对象设计--创建对象
虽然Object构造函数或者对象字面量都可以用来创建单个对象,但是缺点非常明显:使用同一接口创建很多对象,会产生大量重复代码. 工厂模式 1 function CreatePerson(name,a ...
- JS面向对象之创建对象模式
虽然Object构造函数或对象字面量都可以用来创建单个对象,但都有一个缺点,使用同一个接口来创建对象,会产生大量重复的代码,为解决这个问题,引出下列方法 1.工厂模式 抽象了创建具体对象的过程,用函数 ...
随机推荐
- 【Spring IoC】IoC容器初始化(二)
Ioc容器的初始化是由refresh()方法来启动的,这个方法标志着Ioc容器的正式启动. 具体来说这个启动过程包括三个基本过程: BeanDefinition的Resource定位 BeanDefi ...
- LG1983 「NOIP2013」车站分级 拓扑排序
问题描述 LG1983 题解 考虑建立有向边\((a,b)\),代表\(a\)比\(b\)低级. 于是枚举每一辆车次经过的车站\(x \in [l,r]\),如果不是车辆停靠的车站,则从\(x\)向每 ...
- VMware虚拟机安装使用及系统安装教程
虚拟机是利用软件来模拟出完整计算机系统的工具.具有完整硬件系统功能的.运行在一个完全隔离环境中.虚拟机的使用范围很广,如未知软件评测.运行可疑型工具等,即使这些程序中带有病毒,它能做到的只有破坏您的虚 ...
- openLayers绘制静态底图
由于项目需要,需要是使用openlayers框架,于是开始安利一波openlayers,可以点击 https://openlayers.org/ 进入他的官网下载相关资源和案例 学习的过程总是慢慢 ...
- Genome Sequencing of MuseumSpecimens Reveals Rapid Changes in the Genetic Composition of Honey Bees in California
文章地址:https://academic.oup.com/gbe/article/10/2/458/4810442#supplementary-data Abstract 在自然生态系统和管理生态系 ...
- [BJOI2019]奥术神杖(AC自动机,DP,分数规划)
题目大意: 给出一个长度 $n$ 的字符串 $T$,只由数字和点组成.你可以把每个点替换成一个任意的数字.再给出 $m$ 个数字串 $S_i$,第 $i$ 个权值为 $t_i$. 对于一个替换方案,这 ...
- 【领会要领】web前端-轻量级框架应用(jQuery基础)
作者 | Jeskson 来源 | 达达前端小酒馆 jquery的安装和语法,jquery的多种选择器,dom操作和jquery事件. jQuery框架,简介,优势,安装,语法,jQuery选择器,i ...
- [LeetCode] 647. Palindromic Substrings 回文子字符串
Given a string, your task is to count how many palindromic substrings in this string. The substrings ...
- 源码解读SLF4J绑定日志实现的原理
一.导读 我们使用log4j框架时,经常会用slf4j-api.在运行时,经常会遇到如下的错误提示: SLF4J: Class path contains multiple SLF4J binding ...
- 【报名中】【5G探索】深度揭秘5G核心技术与挑战,云+社区开发者大会北京站等你来!
报名渠道(扫描下方二维码) 开发者专属福利 限量手办 现场幸运签到开发者即可获得,早到获奖几率更大 幸运抽奖 一等奖:1名 JBL LIVE650 BTNC无线主动降噪智能耳机 二等奖:3名 JBL ...