资讯专栏INFORMATION COLUMN

读书笔记-1【javascript语言精粹】继承

malakashi / 583人阅读

摘要:使用构造器有个严重的危害,如果在调用构造器函数的时候忘记使用前缀,不仅不会绑定到新对象,还会污染全局变量原型模式原型模式中,我们采用对象来继承。

构造器调用模式

当一个函数对象被创建时,Function构造器会运行类似这样的代码:

this.prototype = {constructor: this}

new一个函数事会发生:

Function.method("new", function() {
    // 创建新对象,继承原型
    let that = Object.create(this.prototype);
    // 调用构造函数,绑定this到新对象
    let res = this.apply(that, arguments);
    return typeof res === "object" && res || that;
}); 
伪类继承
let Mammal = function(name) {
    this.name = name;
}
Mammal.prototype.get_name = function() {
    return this.name;
}

// 构造一个实例
let myMammal = new Mammal("zhangsan");
// 利用伪类继承Mammal
let Cat = function(name) {
    this.name = name;
    this.age = age;
}

Cat.prototype = new Mammal();
Cat.prototype.get_age = function() {
    return this.age;
}

let myCat = new Cat("miao");

以上就是一个简单的伪类继承。使用构造器有个严重的危害,如果在调用构造器函数的时候忘记使用new前缀,this不仅不会绑定到新对象,还会污染全局变量;

原型模式

原型模式中,我们采用对象来继承。

let myMammal = {
    name: "aa",
    age: 22,
    get_name: function() {
        return this.name;
    }
}

let myCat = Object.create(myMammal);
Cat.get_age = function() {
    return this.age;
}

这种继承方式,导致没有私有属性和私有函数

函数化模式

它的每一层都是在扩充that

Function.prototype.method = function (name,func) {
    this.prototype[name] = func;
    return this; 
}
// 工厂mammal函数
var mammal = function (spec) {
    var that = {};

    that.get_name = function () {
        return spec.name;
    }
    that.says = function (spec) {
        return spec.saying || "";
    } 

    return that;
}

// 工厂cat函数(基于mammal的函数)
var cat = function (spec) {
    spec.saying = spec.saying || "meow";
    // 直接调用mammal函数
    var that = mammal(spec);
    that.purr = function (n) {
        var i, s = "";
        for (i = 0; i < n; i += 1) {
            if(s) {
                s += "-";
            }
            s += "r";
        }
    }
    that.get_name = function () {
        return that.says() + " " + spec.name + " " + that.says();
    }
    return that;
}

// 创建myCat对象
var myCat = cat({name: "Henrietta"});

Object.method("superior",function (name) {
    var that = this,
        method = that[name];
    return function () {
        return method.apply(that, arguments)
    }
})

// 工厂coolcat函数(基于cat函数)
var coolcat = function (spec) {
    var that = cat(spec),
        super_get_name = that.superior("get_name");
    that.get_name = function (n) {
        return "like " + super_get_name() + " baby";
    }
    return that;
}

var myCoolCat = coolcat({name : "Bix"});

var name = myCoolCat.get_name();
部件

没看懂。。

let eventuality = function(that) {
    let registry = {};
    that.fire = function(event) {
        let array, 
            func,
            handler,
            i,
            type = typeof event === "string" ? event : event.type;
        if (registry.hasOwnProperty(type)) {
            array = registry[type];
            for(i = 0; i < array.length; i++) {
                handler = array[i];
                func = handler.method;
                if (typeof func === "string") {
                    func = this[func];
                }
                func.apply(this, handler.parameters || [events]);
            }
        }
        return this;
            
    }
    that.on = function(type, method, parameters) {
        let handler= {
            method,
            parameters
        };
        if (registry.hasOwnProperty(type)) {
            registry[type].push(handler);
        } else {
            registry[type] = [handler];
        }
        return this;
    }
    return that;
}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/104668.html

相关文章

  • JavaScript 语言精粹读书笔记 - 函数

    摘要:语言精粹读书笔记第四章函数函数字面量函数字面量包含个部分第一部分,保留字第二部分,函数名,它可以被忽略。这个超级延迟绑定使得函数对高度复用。构造器调用模式一个函数,如果创建的目的就是希望结合的前缀来调用,那它就被称为构造器构造。 《JavaScript 语言精粹》 读书笔记 第四章 函数 Functions 函数字面量 函数字面量包含4个部分: 第一部分, 保留字 function...

    wdzgege 评论0 收藏0
  • JavaScript 语言精粹读书笔记 - 函数(二)

    摘要:对象被传递到从句中被捕获。一些语言提供了尾递归优化。这意味着如果一个函数返回自身递归调用的结果,那么调用的过程会被替换为一个循环,可以显著提高速度。构建一个带尾递归的函数。语言精粹读书笔记函数 第四章 函数 Functions (二) 参数 arguments arguments数组: 函数可以通过此参数访问所有它被调用时传递给它的参数列表,包括哪些没有被分配给函数声明时定义的形式参数...

    lufficc 评论0 收藏0
  • JavaScript语言精粹 修订版》 读书笔记

    摘要:于是我就先把这本薄的经典书语言精粹修订版豆瓣读书本书简介总共章,除去附录,才页,读完并记录了一些笔记。读书笔记还可以分享给别人看。编程语言第版定义了的标准。程序检查时丢弃值为函数的属性。 之前看到这篇文章,前端网老姚浅谈:怎么学JavaScript?,说到怎么学习JavaScript,那就是看书、分析源码。10本书读2遍的好处,应该大于一本书读20遍。看书主动学习,看视频是被动学习。看...

    EscapedDog 评论0 收藏0
  • 读书笔记:编写高质量javascript的68个方法

    摘要:第条尽量少使用全局对象避免声明全局变量尽量声明局部变量避免对全局变量增加属性第条始终声明局部变量第条避免使用语句第条熟练使用闭包的函数值包含了比调用他们时执行所需要的代码还要更多的信息。那些在其所涵盖的作用域内跟踪变量的函数称为闭包。 书还没看完。一遍看,一遍写读书笔记。 这本书的序是JavaScript之父Brendan Eich写的,作者是JavaScript标准化委员会专家。可想...

    Vicky 评论0 收藏0
  • javascript语言精粹》学习笔记 - 继承

    摘要:但采用构造器调用模式,即是使用了前缀去调用一个函数时,函数执行的方式会改变。对象包含构造器需要构造一个新的实例的所有信息。构造器的变量和内部函数变成了该实例的私有成员。 JavaScript 是一门弱类型语言,从不需要类型转换。对象继承关系变得无关紧要。对于一个对象来说重要的时它能够做什么,而不是它从哪里来。 阅读《javascript语言精粹》笔记! 伪类 js的原型存...

    harriszh 评论0 收藏0

发表评论

0条评论

malakashi

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<