`
lxs647
  • 浏览: 517129 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js中定义对象的几种方式

阅读更多

1. 基于已有对象扩充其对象和方法(只适合于临时的生成一个对象):

 

var obj = new Object();

obj.name="userObject";

obj.printName = function(name){

    this.name = name;

    alert(this.name);

}

 

obj.printName("newUserObject");

 

2.工厂方式创建对象(每次创建一个object后,其中对应的方法(本例中是get)也被创建一次,方法不能被所创建的所有对象(本例中是obj1和obj2)共享):

 

a. 

function createObject(){

    var obj = new Object();

    obj.name="userObject";

    obj.password = "12345";

    obj.get = function(){

        alert(this.name + ", " + this.password);

    }

    return obj;

}

 

var obj1 = createObject();

var obj2 = createObject();

obj1.get();

obj2.get();

 

b.带参数的构造方法:

function createObject(username,password){

    var obj = new Object();

    obj.username = username;

    obj.password = password;

    obj.get = function(){

        alert(this.username + ", " + this.password);

    }

    return obj;

}

 

var obj1 = createObject("zhangsan","123456");

obj1.get();

 

c.让函数被多个创建的对象所共享,而不是每一个对象都创建一个相同的函数(缺点:对象定义本身和方法分离了):

 

function get(){

    alert(this.username + ", " + this.password);

}

 

function createObject(username,password){

    var obj = new Object();

    obj.username = username;

    obj.password = password;

    obj.get = get;

    return obj;

}

 

var obj1 = createObject("zhangsan","123456");

var obj2 = createObject("lisi","54321");

obj1.get();

obj2.get();

 

 

 

3.构造函数方式:

 

a.

function Person(){

    this.username = "zhangsan";

    this.password = "123";

    this.getInfo = function(){

        alert(this.username + ", " + this.password);

    }

}

 

var person = new Person();

person.getInfo();

 

b.可以在构造函数是传递参数:

 

function Person(username,password){

    this.username = username;

    this.password = password;

    this.getInfo = function(){

        alert(this.username + ", " + this.password);

    }

}

 

var person = new Person("zhangsan","123");

person.getInfo();

 

 

4.使用原型(prototype)方式创建对象:

优点:创建的多个对象共享同一个方法(getInfo)

缺点:创建的多个对象在共享同一个方法的同时也共享了同样的属性(username,password),实际开发中这样儿是

         不行的,必须是多个对象都要有自己的属性。

采用该方式创建对象通常是用来扩展已有对象的某一个方法。

 

a.

function Person(){}

 

Person.prototype.username = "zhangsan";

Person.prototype.password = "123";

 

Person.prototype.getInfo = function(){

    alert(this.username + ", " + this.password);

}

 

var person = new Person();

var person2 = new Person();

 

person.username = "lisi";

 

person.getInfo();

person2.getInfo();

 

 

b.如果使用原型方式创建对象,那么生成的所有对象将会共享原型中的属性,这样儿一个对象改变了该属性也会反应到其他的对象上:

 

function Person(){}

 

Person.prototype.username = new Array(0;

Person.prototype.password = "123";

 

Person.prototype.getInfo = function(){

    alert(this.username + ", " + this.password);

}

 

var person = new Person();

var person2 = new Person();

 

person.username.push("zhangsan");

person.username.push("lisi");

person.password = "456";

 

person.getInfo();

person2.getInfo();

 

 

c.使用原型和构造函数方式来创建对象:

 

function Person(){

    this.username = new Array();

    this.password = "123"

}

 

Person.prototype.getInfo = function(){

    alert(this.username + ", " + this.password);

}

 

var person = new Person();

var person2 = new Person();

 

person.username.push("zhangsan");

person.username.push("lisi");

 

person.getInfo();

person2.getInfo();

 

5.动态原型方式:在构造函数中通过标志量让所有对象共享一个方法,而每个对象拥有自己的属性。

 

function Persion(){

    this.username = "zhangsan";

    this.password = "123";

 

    if(typeof Person.flag == "undefined"){

        Person.prototype.getInfo = function(){

            alert(this.username + ", " + this.password);

        }

        Person.flag = true;

    }

}

 

var p = new Person();

var p2 = new Person();

 

p.getInfo();

p2.getInfo();

分享到:
评论

相关推荐

    JAVASCRIPT中定义对象的几种方式.pdf

    JAVASCRIPT中定义对象的几种方式.pdf

    Javascript对象定义的几种方式

    Javascript对象定义的几种方式

    【JavaScript源代码】详解js创建对象的几种方式和对象方法.docx

    详解js创建对象的几种方式和对象方法  这篇文章是看js红宝书第8章,记的关于对象的笔记(第二篇)。 创建对象的几种模式:  工厂是函数的意思。工厂模式核心是定义一个返回全新对象的函数。 function getObj...

    JavaScript定义类的几种方式总结

    提起面向对象我们就能...javaScript中创建自己的类和对象,我们应该是必须掌握的,我们都知道javaScript中对象的属性可以在对象创建后动态定义,比如下面的代码: 代码如下:[removed] //定义 var oCar = new Objec

    JS定义函数的几种常用方法小结

    本文实例讲述了JS定义函数的几种常用方法。分享给大家供大家参考,具体如下: 在 JavaScript 语言里,函数是一种对象,所以可以说函数是 JavaScript 里的一等公民(first-class citizens)。 之前我们这样定义过一个...

    JS对象创建的几种方式整理

    最近一直在看JS高级程序设计这本书,有空来梳理一下几种创建对象的方式。话不多说,直接步入正题。 第一种:Object构造函数创建 var Person = new Object(); Person.name = 'Nike'; Person.age = 29; 这行代码创建...

    关于JavaScript定义类和对象的几种方式

    可以看看这个例子: 代码如下: var a = ‘global’; (function () { alert(a); var a = ‘local’;...因为所有JavaScript函数都是一个对象。在函数里声明的变量可以看做这个对象的“类似属性”。对

    js中创建对象的几种方式

    本文穿插了js原型和函数的相关知识,讨论了批量创建对象的几种方式以及它们的优缺点。 正文 说起创建对象,最容易想到的便是通过对象字面量方式直接定义一个对象吧,但这种方式只能创建少量,单独且相互间无联系的...

    CKevens#-#05-02.面向对象:类的定义和继承的几种方式1

    前言类与实例:类的声明生成实例类与继承:如何实现继承:继承的本质就是原型链继承的几种方式类的定义、实例化类的定义/类的声明方式一:用构造函数模拟类(传统写法)/

    haoyi2015#Web-1#05-02.面向对象:类的定义和继承的几种方式1

    前言类与实例:类的声明生成实例类与继承:如何实现继承:继承的本质就是原型链继承的几种方式类的定义、实例化类的定义/类的声明方式一:用构造函数模拟类(传统写法)/

    JavaScript定义类或函数的几种方式小结

    工厂方式 javaScript中创建自己的类和对象,我们应该是必须掌握的,我们都知道javaScript中对象的属性可以在对象创建后动态定义,比如下面的代码: 代码如下: [removed] //定义 var oCar = new Object();

    JS函数的几种定义方式分析

    本文实例讲述了JS函数的几种定义方式。分享给大家供大家参考,具体如下: JS函数的定义方式比较灵活,它不同于其他的语言,每个函数都是作为一个对象被维护和运行的。 先看几种常用的定义方式: function func1(...

    JS 创建对象(常见的几种方法)

    方便学习js类的朋友,让你快速的掌握js类的定义方法,方法有很多种,结果都一样。大家可以根据自己的爱好选用。

    (vue面试题)在Vue.js中如何定义组件?请简述组件之间的通信方式代码.txt

    在Vue.js中,可以使用Vue.component()方法来定义组件。该方法接受两个参数:组件名称和组件选项对象。 组件选项对象可以包含以下属性: - template:组件的模板字符串。 - data:组件的数据对象。 - methods:组件...

    常用javascript整理

    1.JavaScript的数值处理对象学习 .txt 2.JavaScript的系统函数学习 .txt 3.js中用于对象的语句——with和for...in语句...定义JavaScript对象的几种格式.txt 8.正则表达式.txt 9.55种网页常用小技巧 .txt

    创建一般js对象的几种方式

    1.对象字面量创建对象 var obj = { a:1,b:2 }; 注意:对象字面量是一个表达式,这种表达式每次运算...js中原始类型都包含内置的构造函数,也可以自己定义构造函数。 3.通过立即执行函数创建对象 var obj = (function

    js创建对象的几种常用方式小结(推荐)

    第一种模式:工厂方式 代码如下: var lev=function()...在函数中定义对象,并定义对象的各种属性,,虽然属性可以为方法,但是建议将属性为方法的属性定义到函数之外,这样可以避免重复创建该方法 2.引用该对象的时候,这

Global site tag (gtag.js) - Google Analytics