0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看威廉希尔官方网站 视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

JavaScript创建对象的方式

西西 2018-02-22 09:32 次阅读

JavaScript中有几种创建对象的方式,本文将一一介绍,工厂模式、构造函数模式、原型模式、动态原型模式、组合使用构造函数模式和原型模式。

传统的创建对象的方式:

1、创建Object的实例

JavaScript创建对象的方式

2、对象字面量形式创建单个对象

JavaScript创建对象的方式

创建对象的五种设计模式

1、工厂模式

虽然Object构造函数和对象字面量都可以用来创建单个对象,但这个方式有个明显的缺点:使用同一个接口创建很多对象,会产生大量重复的代码。为了解决这个问题,开始使用工厂模式。

JavaScript创建对象的方式

2、构造函数模式

工厂模式虽然解决了创建多个相似对象的问题,但却没有解决对象识别的问题(即不知道对象的类型),于是,又出现了构造函数模式,自定义的构造函数意味着将来可以把它的实例识别为一种特定的类型。这是构造函数模式胜过工厂模式的地方。

JavaScript创建对象的方式

构造函数模式与工厂模式的不同之处在于:1)没有显式地创建对象;2)直接将属性和方法赋给了this对象;3)没有return语句。

构造函数的问题:每个方法都要在每个实例上重新创建一遍。由于JavaScript中的函数是对象,每定义一个函数,就是实例化了一个Funtion对象,因此,使用构造函数创建的每个实例都有一个名为showName()的方法,但这些方法不是同一个Function的实例。不同实例上的同名函数是不相等的,因此person1.showName == person2.showName返回false。

可以通过把函数定义转移到构造函数外部来解决这个问题,如下:

JavaScript创建对象的方式

这样虽然解决了方法多次创建问题,但又出现了新的问题:

(1)在全局作用域中定义的函数实际上只能被某个对象调用,这让全局作用域名不副实。

(2)如果对象需要定义很多方法,那么就需要定义很多个全局函数,那么就毫无封装性可言了。

这些问题可以通过使用原型模式来解决。

3、原型模式

每个函数都以一个原型prototype属性,是一个指针,指向一个对象。

使用原型对象的好处是可以让所有对象实例共享它所包含的属性和方法。也就是说,不必在构造函数中定义对象实例的信息,而是可以直接将这些信息添加到原型对象中。

JavaScript创建对象的方式

使用原型模式创建的新对象具有相同的属性和方法。与构造函数模式不同的是,新对象的这些属性和方法是由所有对象所共享的。这会导致所有实例默认有一样的属性值,因此person1.showName == person2.showName返回true。

读取某个对象的某个属性的搜索方法:

1)首先在实例中搜索,若找到指定属性,则返回该属性的值。

2)否则继续搜索指针指向的原型对象。

使用delete 实例名。属性名可以删除实例的某一属性。

使用hasOwnProperty()方法可以判断属性是存在于实例中,还是存在于原型中。只有给定属性存在于实例中,才会返回true。

in操作符会在通过对象能够访问给定属性时返回true,无论该属性存在于实例中还是原型中。

同时使用hasOwnProperty()方法和in操作符,能够确定属性到底是存在于对象中,还是存在于原型中。

JavaScript创建对象的方式

原型模式更简单的语法:以一个包含所有属性和方法的对象字面量来创建原型对象。

JavaScript创建对象的方式

用对象字面量来创建原型对象的结果相同,只是constructor属性不再指向Person。这是由于这样已经完全重写了默认的prototype对象,因此constructor属性也就变成了新对象的constructor属性,指向Object构造函数但不指向Person函数。此时,instanceof操作符还能返回正确的结果但通过constructor已经无法确定对象的类型了。

JavaScript创建对象的方式

如果constuctor的值很重要,可以特意将其设置回适当的值。

JavaScript创建对象的方式

重写原型对象切断了现有原型与任何之前已经存在的对象实例之间的联系,对象实例引用的仍然是最初的原型。

JavaScript创建对象的方式

4、组合使用构造函数模式和原型模式

原型对象的问题:最大问题是由于共享属性导致的。原型中所有属性是被实例共享的,这对于函数很合适,对那些包含基本值的属性也还说得过去,因为可以通过在实例上添加同名属性,隐藏原型中的对应属性。然而,对于包含引用值的属性来说,问题就比较突出了,修改某个实例的引用类型的属性也会通过原型影响到其它实例的该属性。

创建自定义类型的最常见方法是组合使用构造函数模式和原型模式,构造函数模式用于定义实例属性,原型模式用于定义方法和共享的属性。

JavaScript创建对象的方式

5、动态原型模式

动态原型模式把所有信息都封装在了构造函数中,而通过在构造函数中初始化原型,又保持了同时使用构造函数和原型的优点。

可以通过检查某个应该存在的方法是否有效,来决定是否需要初始化原型。

如:只在showName()方法不存在的情况下,才会将它添加到原型中,这段代码只会在初次调用构造函数时才会执行。

JavaScript创建对象的方式

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 对象
    +关注

    关注

    1

    文章

    38

    浏览量

    17388
  • javascript
    +关注

    关注

    0

    文章

    516

    浏览量

    53851
收藏 人收藏

    评论

    相关推荐

    JavaScript中的Object

    1. 对象的定义?向对象的语?都有一个标志,即类。定义:对象JavaScript 的一个基本数据类型,是?种复合值,它将很多值(原始值或者其他
    发表于 09-18 09:05

    请问如何通过创建窗口对象方式实现界面切换?

    如何通过创建窗口对象方式实现界面切换?
    发表于 04-19 07:48

    JavaScript 【1】 基础数据类型

    Boolean;var cars=new Array;var person= new Object; JavaScript 变量均为对象。当您声明一个变量时,就创建了一个新的对象
    发表于 07-17 10:32

    JavaScript 【2】对象

    (), 它会返回函数的定义:实例objectName.methodName有多种方式可以创建,使用和修改 JavaScript 对象。同样也有多种
    发表于 07-17 10:33

    JavaScript【8】JSON

    ;www.taobao.com"} ]} JSON 格式化后为 JavaScript 对象JSON 格式在语法上与创建 JavaScript 对象
    发表于 07-17 10:45

    java如何创建对象的分析

    作为Java开发者,我们每天创建很多对象,但我们通常使用依赖管理系统,比如Spring去创建对象。然而这里有很多创建
    发表于 09-27 14:36 0次下载

    实例分析Java中创建对象

    Java中有5种创建对象方式,下面给出它们的例子还有它们的字节码 Paste_Image.png 如果你运行了末尾的的程序,你会发现方法1,2,3用构造函数创建
    发表于 09-28 13:29 0次下载

    javascript原型是什么_javascript常用框架介绍

    JavaScript 是面向对象的脚本语言,长期以来用作 Web 浏览器应用程序的客户端脚本接口。JavaScript 让 Web 开发人员能以编程方式处理 Web 页面上的
    发表于 12-04 17:07 2964次阅读
    <b class='flag-5'>javascript</b>原型是什么_<b class='flag-5'>javascript</b>常用框架介绍

    使用JavaScript创建对象的方法和案例

    Javascript中的一切几乎都是对象,无论是数组还是函数。本文将教你使用JavaScript创建对象的三种方法。
    的头像 发表于 07-06 09:41 2934次阅读

    JavaScript中动态的创建QML对象

    在实际QML应用开发中,我们可以在JavaScript中动态的创建QML对象。这样做可以延迟对象的实例化,当我们在需要创建
    的头像 发表于 09-01 10:42 1559次阅读

    Java中创建对象有哪些方式

    1 问题 作为Java开发者,经常创建很多对象,你是否知道Java中创建对象有哪些方式呢?
    的头像 发表于 02-24 10:29 1045次阅读

    Java反射威廉希尔官方网站 实现对象创建

    创建对象,什么时候我们改用反射创建对象呢? 两者创建对象的效率又是如何呢?   //new 
    的头像 发表于 05-22 14:25 2304次阅读
    Java反射威廉希尔官方网站
实现<b class='flag-5'>对象</b>的<b class='flag-5'>创建</b>

    python创建文件对象

    2.1. 创建文件对象 **open() 函数用于创建文件对象,基本语法格式如下:** open(文件名[,打开方式]) 注意: 如果只是文
    的头像 发表于 06-21 17:19 1565次阅读
    python<b class='flag-5'>创建</b>文件<b class='flag-5'>对象</b>

    javascript的成熟分类

    JavaScript的成熟分类可以从多个角度进行划分,以下是几种常见的分类方式: 语言成熟度: 解释型语言:JavaScript是一种解释型语言,这意味着它不需要在编译期间进行预处理或编译。 动态
    的头像 发表于 11-16 10:30 32.2w次阅读

    javascript的内置对象有哪些

    你全面了解JavaScript的能力和应用场景。 一、基本数据类型对象: String(字符串对象):用于处理和操作文本数据。 Number(数字对象):用于处理和操作数字数据。 Bo
    的头像 发表于 12-03 11:39 1341次阅读