揭开web前端的面纱

面向对象的多种写法

2017-02-27  本文已影响155人  ferrint

关键词: 构造函数

第一种写法

    function Person(name,age) {
        // 1.原料
        var obj = new Object();
        // 2.加工
        obj.name = name;
        obj.age =  age;

        obj.showName = function () {
            alert(this.name);
        };
        obj.showSex = function () {
            alert(this.age);
        };
        // 3. 出厂
        return obj;
    }
    var p1 = Person("赵无梦","20");
    var p2 = Person("张梦华","30");
    alert(p1.showName() == p2.showName());  // true
    alert(p1.showName == p2.showName);      // false

    p1.showName();
    p1.showSex();
    p2.showName();
    p2.showSex();

第二种写法

    var a = function () {
        alert(1);  // 不执行
    };
    var b = function () {
        alert(2);
    };
    alert (a == b);
    // 相当于
    var  a = new function () {alert(1)};
    var  b = new function () {alert(2)};
    var  a = new Function ("alert(1)");  // 必须加引号才能执行
    var  b = new Function (alert(1));

第三种写法

    function Person(name,age) {

        // 2.加工
        this.name = name;
        this.age =  age;

        this.showName = function () {
            alert(this.name);
        };
        this.showSex = function () {
            alert(this.age);
        };
    }
    var p1 = new Person("张无忌","45");
    var p2 = new Person("风清扬","35");
    alert(p1.showName == p2.showName);      // false 问题依然没解决

   p1.showName();
   p1.showSex();
   p2.showName();
   p2.showSex();

this的指向问题

    function show() {
        alert(this)
    }
    show();   // object window    执行了一个函数,该函数属于顶层对象Window 下
    new show(); // object object   实例化了一个对象,该函数属于顶层函数对象Function下

    function Demo() {
        var that = this;
        this.b = 5;
        document.getElementById("btn").onclick = function () {
            that.show();
        };
    }
    Bbb.prototype.show = function () {
        alert(this.b);
    };
    var a = new Bbb();

未完待续。。。

上一篇下一篇

猜你喜欢

热点阅读