JavaScript和其他语言略有不同,在JavaScript中,引用数据类型都是对象(包括函数)。不过,在JavaScript中并没有“类”的概念,这决定了在JavaScript中不能直接来定义“类”以及继承"类”。

不过在JavaScript中却可以通过构造函数来实现创建“类”和“实例对象”,在这一点上它与java中“类”的构造函数作用类似。

接下来我们来看一下对象的创建模式:

1.Object构造函数模式

var obj=new Object();
obj.name='mmzkyl';
obj.age=18;
obj.show=function(){
console.log("hi 我是"+this.name);
}
obj.show();

通过这种模式虽然可以较为简单的创建对象,但是却无法大量创建对象

2.对象字面量模式

var obj={
 name:'mmzkyl',
 age:18,
show:function(){
console.log("hi 我是"+this.name);
}
}
obj.show();

这种对象创建模式与第一种在本质上来说并没有什么大的区别,不过相比于第一种创建方式,这种创建方式较为简洁一些。

3.工厂模式

function Person(name,age)
{
var obj=new Object();
obj.name=name;
obj.age=age;
obj.show=function(){
console.log("hi 我是"+this.name);
}
return obj;
}
var person=Person('mmzkyl',18);
person.show();

这种创建方法相比于前面两种有了很大的进步,最明显的莫过于这种创建方式可以大量的实例化对象。

这虽然解决了一些问题,但是却存在着一些问题,看如下代码:

function Dog(name,age)
{
var obj=new Object();
obj.name=name;
obj.age=age;
obj.show=function(){
console.log("汪汪汪");
}
return obj;
}
var dog=Dog('mary',2);
dog.show();

在这里我又创建了一个关于狗的对象。

接下来,我们来看一下他们实例化对象的类型:

console.log(person instanceof Person,person instanceof Object);
console.log(dog instanceof Dog,dog instanceof Object);

由输出我们可以发现问题所在,我们原来的目标是创建不同的对象,但是目前我们所得到的对象类型却都是一样的,这产生了一个对象识别的问题。

其产生原因也很简单,上述我们创建对象时都是通过"new Object()"来创建,所以创建的对象一定都是Object的实例化对象,无法识别对象类型也是应该的。

4.构造函数模式

function Person(name,age){
this.name=name;
this.age=age;
this.show=function(){
console.log("hi 我是"+this.name);
}
}
var person=new Person('mmzkyl',18);
person.show();

这种创建模式与上一种创建模式略有不同:

a.没有显式的使用new Object()来创建对象

b.直接将属性和方法赋值给了this对象

c.没有return语句。

实际上,这种创建模式会经历以下几个步骤:

a.创建一个新的对象

b.将构造函数的作用域赋值给新对象(因此this便指向这个新对象了)

c.执行构造函数中的代码

d.将新对象返回

虽然需要经历这些步骤,但是有一些步骤我们是无法看到的。

此外,通过这种方法创建的对象若要实例化则必须使用new操作符。

同样的,我再创建一个关于狗的对象:

function Dog(name,age){
this.name=name;
this.age=age;
this.show=function(){
console.log("汪汪汪");
}
}
var dog=new Dog('mary',2);
dog.show();

现在,我们再来测试一下他们对象的类型:

console.log(person instanceof Person,person instanceof Object);
console.log(dog instanceof Dog,dog instanceof Object);

从这里就可以看到这种对象的创建模式可以解决对象的识别问题。

但是构造函数也存在着一些问题,构造函数的实例化对象时,每实例化一个对象都要将方法在每一个实例上重新创建一遍,这无疑是积极浪费资源的。

对于这个问题,我们可以通过如下方法来进行解决:

function Person(name,age){
this.name=name;
this.age=age;
this.show=show;
}
function show(){
console.log("hi 我是"+this.name);
} var person=new Person('mmzkyl',18);
person.show();

我们在全局作用域创建一个函数,将函数赋值给对象内的属性,这样就可以解决浪费资源的问题。

但是,问题又来了,如果要创建很多对象,每个对象又有着各自的方法,这无疑会严重污染全局作用域;此外,这样的创建方式已经毫无封装性可言了。

5.构造函数+原型的组合模式

function Person(name,age){
this.name=name;
this.age=age;
}
Person.prototype.show=function(){
console.log("hi 我是"+this.name);
}
var person=new Person('mmzkyl',18);
person.show();

在这种模式中,实例化对象的属性都是在构造函数中定义的,而需要共享的属性以及方法则是在原型中定义的。


在JavaScript中还有一些其他的对象创建模式,不过由于我还比较菜,对那些还不太熟悉,就不在这里说了。

JavaScript(对象的创建模式)的更多相关文章

  1. Javascript对象的创建模式 -- 深入了解Javascript

    /* 一.模式1:命名空间(namespace) 优点:减少全局命名所需的数量,避免命名冲突或过度 */ // 更简洁的方式 var MYAPP = MYAPP || {}; //定义通用方法 MYA ...

  2. javascript 对象的创建与继承模式

    针对JS高级程序设计这本书,主要是理解概念,大部分要点源自书内.写这个主要是当个笔记加总结 存在的问题请大家多多指正! 6.1理解对象 创建对象的两个方法(暂时) //第一种,通过创建一个Object ...

  3. JavaScript 对象的创建

    Object类型是JavaScript中使用最多的一种类型.创建Object实例的方式有多种,接下来一一列举. 1. Object构造函数 person1的friends属性修改影响了person2的 ...

  4. JavaScript对象的创建

    原文 简书原文:https://www.jianshu.com/p/6cb1e7b7e379 大纲 前言 1.简单方式创建对象的方法 2.工厂模式创建对象 3.构造函数模式创建对象 4.原型模式创建对 ...

  5. JavaScript对象的创建之使用json格式定义

    json: javascript simple object notation. json就是js的对象,但是它省去了xml中的标签,而是通过{}来完成对象的说明. 定义对象 var person = ...

  6. Javascript 对象的创建和属性的判定

    1. 创建对象的方法: 直接使用new 对Object对象进行操作,即对Object 对象进行实例化 <!DOCTYPE html> <html lang="en" ...

  7. js对象的创建模式

    方式一: Object构造函数模式 * 套路: 先创建空Object对象, 再动态添加属性/方法 * 适用场景: 起始时不确定对象内部数据 * 问题: 语句太多 /* 一个人: name:" ...

  8. JavaScript 对象的创建和操作

    <script>         // 对象是属性的无序集合,每个属性都是一个名/值对. 属性名称是一个字符串.         // 对象种类         // 内置对象(nativ ...

  9. JavaScript对象的创建之基于构造方法+原型方式

    为了解决原型所带来的问题,此处需要通过组合构造方法和原型来实现对象的创建,将属性在构造方法中定义,将方法在原型中定义.这种有效集合了两者的优点,是目前最为常用的一种方式. function Perso ...

随机推荐

  1. SpringCloudAlibaba实战教程系列

    一.简介 Spring Cloud Alibaba 致力于提供微服务开发的一站式解决方案.此项目包含开发分布式应用服务的必需组件,方便开发者通过 Spring Cloud 编程模型轻松使用这些组件来开 ...

  2. 关于用C-free进行C语言编程在电脑中生成的.exe和.o文件

    在使用C-free进行C语言编程时,程序运行后会自动在电脑文件中生成以.exe和.o为后缀名的文件: 1,生成的.exe文件为系统自动打包完成的应用程序,该程序可直接在其他无C-free环境的电脑上运 ...

  3. 【Linux常见命令】netstat命令

    netstat - Print network connections, routing tables, interface statistics, masquerade connections, a ...

  4. C语言编程入门题目--No.15

    题目:利用条件运算符的嵌套来完成此题:学习成绩>=90分的同学用A表示,60-89分之间的用B表示, 60分以下的用C表示. 1.程序分析:(a>b)?a:b这是条件运算符的基本例子. 2 ...

  5. Codeforce-CodeCraft-20 (Div. 2)-C. Primitive Primes(本原多项式+数学推导)

    It is Professor R's last class of his teaching career. Every time Professor R taught a class, he gav ...

  6. Blazor一个简单的示例让我们来起飞

    Blazor Blazor他是一个开源的Web框架,不,这不是重点,重点是它可以使c#开发在浏览器上运行Web应用程序.它其实也简化了SPA的开发过程. Blazor = Browser + Razo ...

  7. Docker 快速安装Jenkins完美教程 (亲测采坑后详细步骤)

    一.前言 有人问,为什么要用Jenkins,在一些中小型企业?我说下我以前开发的痛点,每次开发一个项目完成后,需要打包部署,可能没有专门的运维人员,只能开发人员去把项目打成一个war包,可能这个项目已 ...

  8. Java:手写幼儿园级线程安全LRU缓存X探究影响命中率的因素

    最近遇到一个需求,需要频繁访问数据库,但是访问的内容只是 id + 名称 这样的简单键值对. 频繁的访问数据库,网络上和内存上都会给数据库服务器带来不小负担. 于是打算写一个简单的LRU缓存来缓存这样 ...

  9. Codeforces 1332 D. Walk on Matrix(构造矩阵)

    怎么构造呢? \(首先我们不可能去构造一个2000*2000的矩阵,那太复杂了\) \(也许我们可以看看2*2的矩阵??\) \[\left[ \begin{matrix} x&y\\ z&a ...

  10. E - 梦幻岛宝珠 HYSBZ - 1190 变形01背包 难

    E - 梦幻岛宝珠 HYSBZ - 1190 这个题目我觉得很难,看题解都看了很久. 首先可以得到一个大概的思路就是分组,每一个数都可以分成 a*2^b  所以把b相同的数都分成一个组. 在每一组内部 ...