文档章节

javascript对象的创建

玄影镜心
 玄影镜心
发布于 2015/08/26 18:32
字数 753
阅读 16
收藏 0

创建对象:

var person = new Obejct();
person.name = 'sun';
person.sayName = function(){
    alert(this.name);   //this.name将被解析为person.name
}

对象字面量语法但是当需要创建多个对象时,会产生大量重复的代码:

var person = {
    name : 'sun',
    age : 11,
    sayName : function(){
        alert(this.name);
    }
}

工厂模式:用函数来封装特定对象的创建细节

function createPerson(name, age){
    var p = new Object();
    p.name = name;
    p.age = age;
    p.sayName = function(){
        alert(this.name);
    };
    
    return p;
}

var person1 = createPerson("sun", 13);

问题:没有解决对象识别问题(不能知道对象的类型)。

构造函数模式

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

var person1 = new Person("sun",12);

alert(person1.constructor);

1:不再显示的创建对象

2:直接将属性和方法赋值给this对象

3:没有return语句

构造函数模式的问题:每个方法都要在每个实例上春心创建一遍。

解决这个问题的简单方法——把函数的定义转移到构造函数外部。

下面例子中所有对象实例将共享一个全局的函数,函数sayName被调用时,通过this绑定执行环境中的Person对象

function Person(name){
    this.name = name;
    this.sayName = sayName;//指针
}

function sayName(){
    alert(this.name);
}

新问题:如果需要定义多个方法,就要定义多个全局函数。且此方法破坏了新对象类型的封装性。

原型模式:

每个函数都有一个原型属性:prototype,它是一个指针,指向一个对象。这个对象的用途是:包含特定类型的所有实例共享的属性和方法。

使用原型对象的好处:让所有对象实例共享它所包含的属性和方法。

function Person(){}

Person.prototype.name = 'sun';
Person.prototype.age = 18;
Person.prototype.sayName = function(){
                        alert(this.name);
                  };
                  
var person1 = new Person();
alert(person1.name);    //sun
var person2 = new Person();
alert(person2.name);    //sun
alert(person1.sayName == person2.sayName);    //true,同一个方法

每创建一个函数,就会同时创建他的prototype对象,这个对象也会自动拥有一个constructor属性指向函数本身。

更简单的原型模式:  原型+对象字面量

function Person(){}

Person.prototype = {
    //constructor : Person,
    name : 'sun',
    age : 15,
    job : '...',
    sayName : function(){
        alert(this.name);
    }
};

注意:此时constructor属性不在指向Person。

这种语法的本质:完全重写了默认的prototype对象,这个对象也会自动获得一个constructor属性,这个constructor指向Object构造函数,

如果constructor真的很重要,可以像上面注释掉的那样,显式的生命constructor

但这个constructor是可枚举的,默认的constructor是不可枚举的,因此可以使用下列方法设置。

(该方式仅适用于兼容ECMAScript5的浏览器)

Object.defineProperty(Person.prototype, "constructor", {
    enumerable : false ;   //不可枚举
    value : Person
});

  

原型模式的问题:prototype中的属性值如果是引用类型,会被所有对象实例共享。

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

    构造函数模式用于定义实例的属性,原型模式用于定义方法和共享的属性。

function Person(name, age){
    this.name = name;
    this.age = age;
    this.friends = ["sun","cheng"];
}

Person.prototype = {
    constructor : Person,
    sayName : function(){
               alert(this.name);
       }
}






© 著作权归作者所有

玄影镜心
粉丝 9
博文 97
码字总数 52277
作品 0
西安
高级程序员
私信 提问
关于javascript的原型和原型链,看我就够了(一)

关于js的原型和原型链,有人觉得这是很头疼的一块知识点,其实不然,它很基础,不信,往下看 要了解原型和原型链,我们得先从对象说起 创建对象 创建对象的三种方式: 对象直接量 通过对象直...

陌上寒
2018/11/03
0
0
JavaScript 中的面向对象编程

介绍 JavaScript 是一个强大的面向对象编程语言,但是,并不像传统的编程语言,它采用一个以原型为基础的OOP模型,致使它的语法让大多数开发人员看不懂。另外,JavaScript 也把函数作为首要的...

oschina
2016/09/09
5.1K
7
JavaScript 学习(2)

参考: http://www.w3cschool.cc/js/js-window.html 四、浏览器 BOM 浏览器对象模型(BOM)使JavaScript有能力与浏览器“对话”。 (1)Window 浏览器对象模型(Browser Object Model),尚无...

明天以后
2014/10/01
0
0
JavaScript继承(五)——寄生式继承

首先回顾一下原型式继承: 寄生式继承是与原型式继承紧密相关的一种思路,并且同样也是由克罗克福德推而广之的。 说到寄生式继承不得不说工厂模式和寄生构造函数模式创建对象。下面来回顾一下...

Bob2100
02/13
0
0
JavaScript中的this指针 理论化this指针的定义

JavaScript现在应用之广泛,远超其他任何语言,只要是一个合格的网站应用,基本上多多少少都会有JS的存在。在JavaScript中,this的指向被不少Coder所不解,但其实JS中的this理解起来也是相当...

superwebmaster
2018/05/29
0
0

没有更多内容

加载失败,请刷新页面

加载更多

UserInputControls用户输入控制

enum UserInputControls { kGovernedByOrthoMode = 0x0001,//正交模式管理 kNullResponseAccepted = 0x0002,//允许输入空 kDontEchoCancelForCtrlC = 0x0004,//ctrl C 模式不能重复......

一个小妞
30分钟前
1
0
分布式系统的事务处理

当我们在生产线上用一台服务器来提供数据服务的时候,我会遇到如下的两个问题: 1)一台服务器的性能不足以提供足够的能力服务于所有的网络请求。 2)我们总是害怕我们的这台服务器停机,造成...

群星纪元
32分钟前
5
0
Kanban VS Scrum:哪个是最好的敏捷项目管理框架

“我们使用敏捷开发。”在与软件开发团队交流时,你会听到很多这样的说法。根据统计,2018年全球约有90%的开发人员在使用敏捷开发。Choerodon猪齿鱼团队也是其中之一。 但是,敏捷并不统一。...

Choerodon
36分钟前
3
0
vue select 慢一步

我在使用vue的select的时候,@change事件里面,写一个axios拿到数据,然后修改某个变量,按理修改变量会立即呈现在页面上面,但实际情况是,值是变更了,但是页面上的效果慢了一步,非常奇怪...

朝如青丝暮成雪
40分钟前
2
0
分布式架构 核心知识体系

1.问题 1、何为分布式何为微服务? 2、为什么需要分布式? 3、分布式核心理论基础,节点、网络、时间、顺序,一致性? 4、分布式是系统有哪些设计模式? 5、分布式有哪些类型? 6、如何实现分...

小刀爱编程
43分钟前
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部