zoukankan      html  css  js  c++  java
  • js定义对象

    1.工厂模式

    function createPerson(name,age,job){ 
    var o = {}; 
    o.name = name; 
    o.age = age; 
    o.job = job; 
    o.sayName = function(){ 
    alert(this.name); 
    }; 
    return o; 

    var tanya = createPerson("tanya","30","female"); 
    var ansel = createPerson("ansel","30","male"); 
    tanya.sayName(); 
    ansel.sayName(); 

    这里先定义o为一个空的对象,然后为o设置了一堆属性。其实也可以直接给o属性的嘛,所以如果这样写也是ok的。 

    function createPerson(name,age,job){ 
    var o = { 
    name : name, 
    age : age, 
    job : job, 
    sayName : function(){ 
    alert(this.name); 

    }; 
    return o; 

    var tanya = createPerson("tanya","30","female"); 
    var ansel = createPerson("ansel","30","male"); 
    tanya.sayName(); 
    ansel.sayName(); 

    2.构造函数模式 

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

    var tanya = new Person("tanya","30","female"); 
    var ansel = new Person("ansel","30","male"); 
    tanya.sayName(); 
    ansel.sayName(); 

    在这个例子中,tanya和ansel都有一个constructor属性,该属性指向person。 
    考虑一下如下的情况: 

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

    Person("tanya","30","female"); 
    Person("ansel","30","male"); 
    window.sayName(); 
    window.sayName(); 

    发现两次弹出的都是ansel,这是因为不用new的话,就不是一个person的实例,而仅仅在执行函数。而在全局作用域调用一个函数时this总是指向Global对象。而Global对象在浏览器中就是window对象。 

    我们还可以用构造模式在另外一个对象中调用sayName方法,还记得Apply和call么,来吧再考虑另外一种情况, 

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

    var olivia = {}; 
    Person.call(olivia,"tanya","30","female"); 
    olivia.sayName(); 
    var philip = {} 
    Person.apply(philip,["ansel","30","male"]); 
    philip.sayName(); 

    原型模式就要考虑原型链了,分析一下,sayName方法在实例中被重复定义了两次,但其实没有必要创造两个一样的副本。使用原型方法,可以使是tanya和ansel的共享一个sayName方法。 
    于是原型模式的写法如下: 

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

    Person.prototype.sayName= function(){ 
    alert(this.name); 
    }; 
    var tanya = new Person("tanya","30","female"); 
    var ansel = new Person("ansel","30","male"); 
    tanya.sayName(); 
    ansel.sayName(); 

  • 相关阅读:
    互联网思维(1)
    互联网思维
    WLAN和WIFI的区别
    ping操作
    一篇关于正则表达式的小结
    javascript正则表达式
    为什么原型继承很重要 – SegmentFault
    JS面向对象基础讲解(工厂模式、构造函数模式、原型模式、混合模式、动态原型
    【转】前端开发文档规范
    我的第一篇博文
  • 原文地址:https://www.cnblogs.com/sjqq/p/6361086.html
Copyright © 2011-2022 走看看