Javascript我学之六对象工厂函数与构造函数
本文是金旭亮老师网易云课堂的课程笔记,记录下来,以供备忘。
概述
- 使用对象字面量,或者向空对象中动态地添加新成员,是最简单易用的对象创建方法。
- 然而,除了这两种常用的对象创建方式,JavaScript还提供了其他方法创建对象。
1).使用工厂函数创建对象
我们可以编写一个函数,此函数的功能就是创建对象,可将其称为“对象工厂方法”。
//工厂函数
function createPerson(name, age, job) {
var o = new Object();
o.name = name;
o.age = age;
o.job = job;
o.sayName = function () {
console.info(this.name);
};
return o;
}
//使用工厂函数创建对象
var person1 = createPerson('张三', 29, '软件工程师');
var person2 = createPerson('李四', 40, '医生');
2).定义对象构造函数
//定义对象“构造”函数
function Person(name, age, job) {
this.name = name;
this.age = age;
this.job = job;
this.sayName = function () {
console.info(this.name);
};
}
//使用new调用对象构造函数创建对象
var p1 = new Person('张三', 29, '软件工程师');
var p2 = new Person('李四', 40, '医生');
以普通方式调用的“构造函数”
构造函数其实也是一个函数,不同之处在于调用它时必须要加一个“new”关键字,如果不加这个关键字,则对它的调用被认为是普通函数调用。
//作为普通函数调用的构造函数,通过this添加的属性,
//成为了window对象的属性与方法。
console.info(window.name);//张三
console.info(window.age); //
console.info(window.job); //软件工程师
对象构造函数长得这个样:
function Person (name) {
this.name = name;
this.say = function () {
return "I am " + this.name;
};
}
实际上是这样(示意):
function Person (name) {
// var this = {};
this.name = name;
this.say = function () {
return "I am " + this.name;
};
// return this;
}
构造函数完成的工作
对象构造函数与对象工厂方法的区别
对象的constructor属性
a).使用对象工厂函数创建对象,每个对象的constructor属性引用Object()
var person = createPerson('张三', 29, '软件工程师');
//使用工厂方法创建对象,其constructor属性引用Object()函数
console.info(person1.constructor === Object); //true
b).使用对象构造函数创建对象,每个对象的constructor属性引用这个构造函数
var p = new Person('张三', 29, '软件工程师');
//使用对象构造函数创建对象,
//每个对象的constructor属性,引用这个构造函数
console.info(p.constructor === Person); //true
如何避免“忘记”new?
可以使用arguments.callee解决这个问题
//了解arguments.callee的作用
function TestArgumentsCallee() {
console.info(this);
console.info(this instanceof TestArgumentsCallee);
console.info(this instanceof arguments.callee);
};
TestArgumentsCallee(); //window
//false
//false
new TestArgumentsCallee(); //TestArgumentsCallee
//true
//true
于是,可以直接用arguments.callee
//避免忘记new
function MyObject(value) {
if (!(this instanceof arguments.callee)) {
//如果调用者忘记加上new了,就加上new再调用一次
return new MyObject(value);
}
this.prop = value;
}
//测试
var obj1 = new MyObject(100);
console.info(obj1.prop);//
var obj2 = MyObject(200);
console.info(obj2.prop); //
Javascript我学之六对象工厂函数与构造函数的更多相关文章
- js对象工厂函数与构造函数
转自:http://www.cnblogs.com/Jener/p/5920963.html ★概述: 使用对象字面量,或者向空对象中动态地添加新成员,是最简单易用的对象创建方法.然而 ...
- Javascript我学之五对象的创建与使用
本文是金旭亮老师网易云课堂的课程笔记,记录下来,以供备忘. 对象的创建 JavaScript对象有两种类型 1).Native:在ECMAScript标准中定义和描述,包括JavaScript内置 ...
- 前端笔记之JavaScript面向对象(一)Object&函数上下文&构造函数&原型链
一.对象(Object) 1.1 认识对象 对象在JS中狭义对象.广义对象两种. 广义:相当于宏观概念,是狭义内容的升华,高度的提升,范围的拓展.狭义:相当于微观概念,什么是“狭”?因为内容狭隘具体, ...
- JavaScript基础知识(对象、函数与对象)
17.对象 属性:描述对象的信息 方法:描述对象的行为 封装:只关心输入和输出(不管过程如何实现) ü 对象的分类: 内置对象(原生对象): 就是JavaScript语言预定义的对象(如Strin ...
- 5.Javascript 原型链之原型对象、实例和构造函数三者之间的关系
前言:用了这么久js,对于它的原型链一直有种模糊的不确切感,很不爽,隧解析之. 本文主要解决的问题有以下三个: (1)constructor 和 prototype 以及实例之间啥关系? (2)pro ...
- Javascript 原型链之原型对象、实例和构造函数三者之间的关系
前言:用了这么久js,对于它的原型链一直有种模糊的不确切感,很不爽,隧解析之. 本文主要解决的问题有以下三个: (1)constructor 和 prototype 以及实例之间啥关系? (2)pro ...
- JavaScript中的工厂函数
所谓工厂函数,就是指这些内建函数都是类对象,当你调用他们时,实际上是创建了一个类实例. 在学习jQuery的时候,我们经常会看到“工厂函数”这个概念,那么究竟什么是“工厂函数”呢?我们来看看概念,“所 ...
- JavaScript中的构造函数和工厂函数说明
在cnblog上看到一篇文章,讲解JS中的构造函数和工厂函数,觉得讲的真好 JavaScript中的工厂函数和构造函数都能用来创建一个对象,我们可以来看看下面的例子 构造函数 function cre ...
- javascript工厂函数(factory function)vs构造函数(constructor function)
如果你从其他语言转到javascript语言的开发,你会发现有很多让你晕掉的术语,其中工厂函数(factory function)和构造函数(constructor function)就是其中的一个. ...
随机推荐
- springboot 集成swagger
了解到swagger 就记录下用法 pom.xml <dependency> <groupId>io.springfox</groupId> <artifac ...
- [Linux] Vim 撤销 回退 操作
在vi中按u可以撤销一次操作 u 撤销上一步的操作 Ctrl+r 恢复上一步被撤销的操作 注意: 如果你输入“u”两次,你的文本恢复原样,那应该是你的Vim被配置在Vi兼容 ...
- Flask初识
一.Flask初识 1.Flask介绍 Flask是一个使用 Python 编写的轻量级 Web 应用框架.其 WSGI 工具箱采用 Werkzeug服务 ,模板引擎则使用 Jinja2 .Flask ...
- 设置QPushbutton按钮背景、鼠标滑过状态、鼠标点击后状态用法
1.1当要设置QPushbutton按钮背景,字体颜色,鼠标滑过状态,鼠标单击后状态时,可以用QSS来设置,具体的代码如下: QPushButton *allSelect = new QPus ...
- 在mobaxterm内连接deb使用lrzsz进行文件传输
lrzsz随手传文件还是挺方便的. 1.apt install lrzsz 2.rz 3.右键 或者control右键选择 send file useing Z-modem 选择文件上传 接收同理
- java 11 值得关注的新特性
JEP 181: Nest-Based Access Control 基于嵌套的访问控制 JEP 309: Dynamic Class-File Constants 动态类文件 JEP 315: Im ...
- 用Spring构建企业Java应用程序的方法
https://mp.weixin.qq.com/s?__biz=MzU0MDEwMjgwNA==&mid=2247484965&idx=1&sn=ca6b847c65e506 ...
- EM算法(Expectation Maximization Algorithm)初探
1. 通过一个简单的例子直观上理解EM的核心思想 0x1: 问题背景 假设现在有两枚硬币Coin_a和Coin_b,随机抛掷后正面朝上/反面朝上的概率分别是 Coin_a:P1:-P1 Coin_b: ...
- openstack项目【day23】:Neutron实现网络虚拟化
本节内容 一 Neutron概述 二 neutron openvswitch+gre/vxlan虚拟网络 三 neutron ovs opnflow流表和l2 population 四 dhcp ag ...
- [物理学与PDEs]第3章第2节 磁流体力学方程组 2.2 考虑到电磁场的存在对流体力学方程组的修正
1. 连续性方程 $$\bex \cfrac{\p \rho}{\p t}+\Div(\rho{\bf u})=0. \eex$$ 2. 动量守恒方程 $$\bex \cfrac{\p }{\p ...