`
lantian_123
  • 浏览: 1365364 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

JavaScript中对象创建方式

阅读更多

一、最基本的创建方式

var obj = new Object();
obj.name = "zhangsan";
obj.age = 22;
obj.sayHello = function(){
      alert("hello,I'm "+this.name);
}

 可以这样调用:

obj.sayHello();//hello,I'm zhangsan

 优点:创建简单,容易理解

 缺点:如果想创建更多的相同类型的对象,每创建对象时都要去重新定义属性和方法

          代码量加大,不易维护。

          不能创建指定类型的对象,都是object类型的。

 

二、工厂方法模式

把对象的创建过程封装在函数里面

function createObject(name,age){
	var obj = new Object();
	obj.name = name;
	obj.age = age;
	obj.sayHello = function(){
		alert("hello,I'm "+this.name);
	}
	return obj;
}
	
var o2 = createObject("zhangsan",33);

o2.sayHello();

 优点:对象的创建方式变得简易了。创建对象只需调用该方法

 缺点:依然没有解决直接创建方式所带来的“不能创建指定类型的对象”问题

 

三、构造函数模式

function Person(name,age){
	this.name = name;
	this.age = age;
	this.sayHello = function(){
		alert("hello,I'm "+name);
	}
}

var obj = new Person("zhangsan",22);
obj.sayHello();

 优点:解决了前面两种创建方式没有解决的问题,可以创建指定的对象类型

alert(obj instanceof Person); //true
alert(typeof obj);  //object

 缺点:以上所有方式都存在的一个问题就是:每创建一个实例对象,都会创建一个Function的实例,即代码:

sayhello=function(){
      alert("hello,I'm "+this.name);
}
//上面代码等同于

sayHello = new Function(){
        alert("hello,I'm "+this.name);
}

 这样造成资源的浪费,一种解决方案就是把方法提取出来

function Person(name,age){
	this.name = name;
	this.age = age;
	this.sayHello = sayHello;
}

function sayHello(){
	alert("hello,I'm "+this.name);
}

 旧问题解决的,但是新的问题也接踵而来,因为这个全局的sayhello 方法本是为Person类型的对象服务的,但却又放在全局作用域中(在浏览器中可以理解为window对象的作用域)

 还有一个问题就是他的封装性失去意义。这样就衍生了下面一中模式

 

四、原型模式

先看代码:

function Person(){
}
Person.prototype.name = "zhangsana";
Person.prototype.age = 22;
Person.prototype.sayHello = function(){
	alert("hello,I'm "+this.name);
}
var obj1 = new Person();
obj1.sayHello();

 prototype作为每个函数都有的属性,指向一个对象,该对象为特定类型的所有实例共享属性和方法的对象,也就是说,拿上面代码说就是但凡有Person构造方法new 出来的对象都共享name,age,sayHello,而且这下属性和方法内存中只存在一份。附一张草图以便理解,有时间继续写。。。(参考书籍:Professional JavaScript for web Developers Second Edition  Nicholas C. Zalas)

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

  • 大小: 11 KB
分享到:
评论

相关推荐

    javascript创建对象的方式(二)

    在JavaScript中,创建对象是编程的基本操作之一,它支持多种方式来实现这一目的。这篇博客“javascript创建对象的方式(二)”可能详细介绍了在JavaScript中除了最基础的字面量语法之外的其他创建对象的方法。这里...

    javascript创建对象的方式(三)

    本文将详细探讨三种主要的创建JavaScript对象的方法,并结合“源码”与“工具”的概念,来深入理解这些方式在实际开发中的应用。 一、字面量(Literal)方式 这是最简单直接的对象创建方式,通过大括号 `{}` 将属性...

    javascript创建对象的方式(一)

    在实际应用中,开发者会根据需求选择合适的对象创建方式。例如,如果需要创建大量相似的对象,构造函数和原型链可能是最佳选择;而如果想要保持数据私有,模块模式则很有效。理解并熟练运用这些创建对象的方法,将有...

    javascript面向对象创建对象的方式小结.docx

    ### JavaScript面向对象创建对象的方式小结 #### 一、引言 在JavaScript中,面向对象编程(OOP)是一种非常重要的编程范式。它通过创建和操作对象来组织代码,提高代码的复用性和可维护性。本文将详细介绍...

    javascript对象创建

    这个文件可能包含了一些示例代码,用于演示上述的JavaScript对象创建、类定义和继承的实践。通过查看和运行这些代码,你可以更好地理解这些概念并应用到实际项目中。 总结来说,JavaScript对象创建涉及字面量、构造...

    在javascript中创建对象的各种模式解析

    原型模式是另一种在JavaScript中实现对象创建的方式。每个函数都有一个原型属性(prototype),它指向一个原型对象,所有通过该函数创建的对象都会共享原型对象上的属性和方法。这种方式的优点在于节省内存,因为它...

    JavaScript学习之二 — JavaScript创建对象的8种方式

    这个方法允许我们基于现有对象创建新对象,新对象会继承传入对象的原型。 ```javascript var baseObj = { name: 'Base' }; var newObj = Object.create(baseObj); newObj.name; // 'Base' ``` 4. **Object....

    JavaScript对象创建的九种方式

    JavaScript是Web开发中的核心语言,其对象创建是编程过程中不可或缺的一部分。本文将详细介绍JavaScript中九种常见的对象创建方式,帮助开发者更好地理解和应用这些技术。 1. **标准创建对象模式**: 这是最基础的...

    Javascript创建自定义对象 创建Object实例添加属性和方法

    如下所示: 代码如下: var person...上面的例子创建了一个名为person的对象,并为它添加了三个属性(name、age和job)和一个方法(sayName())。其中,sayName()方法用于显示this.name()的值。早期的JavaScript开发人员

    JavaScript对象创建总结

    javascript对象创建方法总结,通过这些方法的总结,可以对对象有了更深一步的了解,也加深了对对象的巩固认识。

    Javascript面向对象编程.

    在JavaScript中,面向对象主要通过以下三种方式实现: 1. **构造函数(Constructor)**:构造函数是一种特殊的函数,用于创建和初始化对象。我们可以通过`new`关键字来调用构造函数,创建一个新的对象实例。例如: ...

    javascript中数组、对象

    在JavaScript中,数组和对象是两种非常基础且重要的数据结构,它们被广泛应用于各种场景,如数据存储、逻辑处理和对象表示。这篇文章将深入探讨这两种数据类型,以及相关的操作和工具。 **一、数组** 数组在...

    JavaScript核心对象参考手册

    2. **对象创建与原型Prototype**: JavaScript使用`new`关键字创建对象实例,原型链允许对象间共享属性和方法,`__proto__`或`prototype`属性是理解这一机制的关键。 3. **函数对象Function**: 在JavaScript中,函数...

    javascript创建对象的方式(四)

    在JavaScript中,创建对象是其面向对象编程的基础。本文将深入探讨四种主要的JavaScript创建对象的方法,帮助你更好地理解和运用这些技巧。 1. **字面量语法(Literal Notation)** 字面量语法是最简单直接的创建...

    javascript如何创建对象

    在JavaScript中,对象可以分为系统对象和自定义对象,系统对象可以通过系统构造函数创建,如Array、Date等,而自定义对象则需要自行创建。 JavaScript创建对象的方法主要有以下几种: 一、直接创建 直接创建是通过...

    JavaScript创建对象的七种方式(推荐)

    JavaScript创建对象的方式有很多,通过Object构造函数或对象字面量的方式也可以创建单个对象,显然这两种方式会产生大量的重复代码,并不适合量产。接下来介绍七种非常经典的创建对象的方式,他们也各有优缺点。 ...

    面向对象JavaScript精要(英文原版pdf)

    - **第三章:JavaScript中的类和对象**:详细介绍如何使用JavaScript创建类和对象。 - **第四章:继承**:探讨JavaScript中实现继承的不同方式。 - **第五章:封装和私有性**:讲解如何在JavaScript中实现封装以及...

    JAVASCRIPT 面向对象编程精要

    在JavaScript中,创建对象可以通过以下方式: ```javascript let person = { name: "John Doe", age: 30 }; ``` 访问对象的属性也很简单: ```javascript console.log(person.name); // 输出 "John Doe" ``` ####...

    JavaScript面向对象编程指南.pdf

    当使用new关键字调用构造函数时,JavaScript引擎会创建一个新的空对象,并且按照构造函数中定义的属性和方法来初始化这个新对象。 3. prototype:在JavaScript中,每个函数都有一个prototype属性,这个属性指向一个...

    一、JavaScript 创建对象

    这篇博客将深入探讨这些方法,帮助你更好地理解和掌握JavaScript中的对象创建。 首先,我们来看最简单的**字面量语法**。这是创建单个对象最直接的方式: ```javascript let person = { name: '张三', age: 30, ...

Global site tag (gtag.js) - Google Analytics