• JavaScript的写类方式(2)


    这篇开始会记录一些写类的工具函数,通过上篇我们知道本质上都是 构造函数+原型。理解了它碰到各式各样的写类方式就不惧怕了。

    构造函数 + 原型 直接组装一个类;同一构造函数将组装出同一类型

    /**
     * $class 写类工具函数之一
     * @param {Function} constructor
     * @param {Object} prototype
     */
    function $class(constructor, prototype) {
    	var c = constructor || function(){};
    	var p = prototype || {};
    	c.prototype = p;
    	return c;
    }
    

    用构造函数来生成类实例的属性(字段),原型对象用来生成类实例的方法。 

    //构造函数
    function Person(name) {
    	this.name = name;
    }
    //原型对象
    var proto = {
    	getName : function(){return this.name},
    	setName : function(name){this.name = name;}	
    }
    //组装
    var Man = $class(Person,proto);
    var Woman = $class(Person,proto);
    

    这时候已经得到了两个类Man,Woman。并且是同一个类型的。测试如下:

    console.log(Man == Woman); //true
    console.log(Man.prototype == Woman.prototype); //true
    

    创建对象看看

    var man = new Man("Andy");
    var woman = new Woman("Lily");
    
    console.log(man instanceof Man); //true
    console.log(woman instanceof Woman); //true
    console.log(man instanceof Person); //true
    console.log(woman instanceof Person); //true
    

    ok,一切如我们所期望。但是有个问题,下面代码的结果输出false

    console.log(man.constructor == Person); //false

    这让人不悦:从以上的代码看出man的确是通过Man类new出来的 var man = new Man("Andy"),那么对象实例man的构造器应该指向Man,但为何事与愿违呢?

    原因就在于工具函数重写了 Person 的原型:c.prototype = p; 
    好了,我们把 $class 稍微改写下,将方法都挂在构造器的原型上(而不是重写构造器的原型),如下:

    /**
     * $class 写类工具函数之一
     * @param {Function} constructor
     * @param {Object} prototype
     */
    function $class(constructor, prototype) {
    	var c = constructor || function(){};
    	var p = prototype || {};
    //	c.prototype = p;
    	for (var atr in p) {
    		c.prototype[atr] = p[atr];
    	}	
    	return c;
    }
    

    相关:

    JavaScript的写类方式(3)

    JavaScript的写类方式(4)

    JavaScript的写类方式(5)

    JavaScript的写类方式(6)

  • 相关阅读:
    卷积操作特征图输出大小
    python函数式编程
    python函数
    列表和元组
    Crontab 执行时没有环境变量!
    github 解决 Agent admitted failure to sign using the key
    Lightgbm 随笔
    btrfs-snapper 实现Linux 文件系统快照回滚
    Ansible playbook API 开发 调用测试
    Linux终端下安装jdk
  • 原文地址:https://www.cnblogs.com/snandy/p/1972254.html
Copyright © 2020-2023  润新知