创建单个对象——字面量方式

创建多个对象

使用字面量方式创建多个对象时,会产生大量的重复代码。开发者在寻找创建多个对象方法的过程中,基本经历了一下集中方法:

工厂模式 > 构造函数模式 > 原型模式 > 构造函数与原型组合 > 寄生构造函数 > 稳妥构造函数模式

工厂模式

function CreatePerson(name, age, job){
var o = new Object(); o.name = name;
o.age = age;
o.job = job;
o.sayName = function(){
alert(this.name);
}
return o;
}

构造函数模式

function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;
this.ageName = sayName;
} function sayName(){
alert(this.name);
}

原型模式

function Person(){
} Person.prototype.name = "xiong";
Person.prototype.age = "26";
Person.prototype.job = "FE";
Person.prototype.sayName = function(){
alert(this.name)
};

问题:当原型上包含引用类型的值得情况下,所有实例会共享该引用类型值。即任何一个实例修改该引用类型值,其他所有的实例也会反映出来。所以很少使用这种方式。

(常用)构造函数模式与原型模式组合

构造函数与原型混成的模式,是目前在ECMAScript中使用最广泛、认同度最高的一种创建自定义类型的方法。可以说是定义引用类型的默认模式。

function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;
this.ageName = sayName;
this.friends = ["Shelby","Court"];
}
// prototype 上共享方法
Person.prototype = {
constructor: Persion,
sayName: function(){
alert(this.name)
}
}

动态原型模式

function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;
this.ageName = sayName;
this.friends = ["Shelby","Court"]; if(typeof this.sayName != "function"){
Person.prototype.sayName = function(){
alert(this.name);
}
}
}

寄生构造函数模式

function Person(name, age, job){
var o = new Object();
o.name = name;
o.age = age;
o.job = job;
o.ageName = sayName;
o.friends = ["Shelby","Court"]; return o;
} var person = new Person("fd",34,"FE");

稳妥构造函数模式

function Person(name, age, job ){
var o = new Object(); o.sayName = function(){
alert(name)
}
return o;
}
var friend = new Person("t", 23, "fe");
friend.sayName();

【Javascript-基础-Object】创建对象的更多相关文章

  1. JavaScript基础:创建对象

    先来看两种简单的对象创建方式: 1.Object构造函数方法 var person = new Object(); person.name = "Nicholas"; person ...

  2. 一步步学习javascript基础篇(3):Object、Function等引用类型

    我们在<一步步学习javascript基础篇(1):基本概念>中简单的介绍了五种基本数据类型Undefined.Null.Boolean.Number和String.今天我们主要介绍下复杂 ...

  3. JavaScript基础学习(四)—Object

    一.Object的基本操作 1.对象的创建      在JavaScript中,创建对象的方式有两种:构造函数和对象字面量.      (1)构造函数 var person = new Object( ...

  4. JavaScript基础

    JavaScript基础 JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScript语言的规则编写相应代码之,浏览器可以解释并做出相应的处 ...

  5. 一步步学习javascript基础篇(0):开篇索引

    索引: 一步步学习javascript基础篇(1):基本概念 一步步学习javascript基础篇(2):作用域和作用域链 一步步学习javascript基础篇(3):Object.Function等 ...

  6. 前端之JavaScript基础

    前端之JavaScript基础 本节内容 JS概述 JS基础语法 JS循环控制 ECMA对象 BOM对象 DOM对象 1. JS概述 1.1. javascript历史 1992年Nombas开发出C ...

  7. Javascript基础回顾 之(三) 面向对象

    本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...

  8. JavaScript 基础回顾——对象

    JavaScript是基于对象的解释性语言,全部数据都是对象.在 JavaScript 中并没有 class 的概念,但是可以通过对象和类的模拟来实现面向对象编程. 1.对象 在JavaScript中 ...

  9. javascript基础部分

    javascript基础部分 1  数据类型: 基础数据类型(通过typeof来检测):Number,string,undefined,null,boolean,function typeof只能检测 ...

  10. 第三篇:web之前端之JavaScript基础

    前端之JavaScript基础   前端之JavaScript基础 本节内容 JS概述 JS基础语法 JS循环控制 ECMA对象 BOM对象 DOM对象 1. JS概述 1.1. javascript ...

随机推荐

  1. 多项式乘法,FFT与NTT

    多项式: 多项式?不会 多项式加法: 同类项系数相加: 多项式乘法: A*B=C $A=a_0x^0+a_1x^1+a_2x^2+...+a_ix^i+...+a_{n-1}x^{n-1}$ $B=b ...

  2. String对象的match方法

    RegExp对象的exec方法和String对象的match方法用法十分相似,分两篇博客讲讲其各自的用法和它们之间的异同.上一篇将exec方法的用法,这篇讲解match方法,并比较其异同. 定义与语法 ...

  3. 03--CSS布局设置

    一 盒模型 盒模型 在CSS中,"box model"这一术语是用来设计和布局时使用,然后在网页中基本上都会显示一些方方正正的盒子.我们称为这种盒子叫盒模型. 盒模型有两种:标准模 ...

  4. JavaScript-原型&原型链&原型继承&组合函数

    小小的芝麻之旅: 今天学习了js的原型,要说原型,我们先简单说一下函数创建过程. 原型 每个函数在创建的时候js都自动添加了prototype属性,这就是函数的原型,原型就是函数的一个属性,类似一个指 ...

  5. plan,idea,and dream

    自学机器学习/数据分析/前端 目前想法是从前端入手,学会写/分析网页及其内容/数据,然后使用爬虫爬取数据,然后用机器学习算法对数据进行处理.哈哈,想法是不是太天真了. 学习都从网上的资料入手,因此发现 ...

  6. HTML中的Head标签学习

    在页面加载完成的时候,标签head里的内容,是不会在页面中显示出来的.它包含了像页面的<title>(标题) ,CSS(如果你想用CSS来美化页面内容),图标和其他的元数据(比如 作者,关 ...

  7. sql处理百万级以上的数据提高查询速度的方法

    原文:http://blog.csdn.net/zhengyiluan/article/details/51671599 处理百万级以上的数据提高查询速度的方法: 1.应尽量避免在 where 子句中 ...

  8. xfs参数简介

    age_buffer_centisecs age_buffer_centisecs:(Min: 100  Default: 1500  Max: 720000) 多长时间设置为脏数据 xfsbufd_ ...

  9. CentOS7安装minio

    [root@localhost ~]# wget https://dl.minio.io/server/minio/release/linux-amd64/minio -bash: wget: 未找到 ...

  10. Android碎笔录1——基本布局

    刚开始学Android开发的时候,没有H5的基础总是分不清android布局文件的用法,真正要学会android布局还是得实战一次,下面不多说,直接上代码. 这是一个登陆界面,LinerLayout嵌 ...