zoukankan      html  css  js  c++  java
  • 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)

  • 相关阅读:
    firewall详解
    Fiddler使用
    Asp.net Core过滤器
    单例模式
    C# 收银机顾显(客显)及打印小票(58热敏打印机)
    sqlite批量处理数据性能优化
    sqlite 插入数据 too many variables
    winform textbox控件keydown、keypress、keyup简单介绍
    ie兼容placeholder效果
    asp.net mvc全局异常捕获
  • 原文地址:https://www.cnblogs.com/snandy/p/1972254.html
Copyright © 2011-2022 走看看