《基于MVC的JavaScript Web富应用开发》读书笔记一:MVC和类

简介:

  Create Class:

var Class = function(parent){
    var klass = function(){
        this.init.apply(this, arguments);
    };

    if(parent) {
        var subclass = function(){};
        subclass.prototype = parent.prototype;
        klass.prototype = new subclass;
    }

    klass.prototype.init = function(){};
    klass.fn = klass.prototype;
    klass.fn.parent = klass;

    klass.proxy = function(func){
        var self = this;
        return (function(){
            func.apply(self, arguments);
        });
    };

    klass.fn.proxy = klass.proxy;

    klass.extend = function(obj){
        var extended = obj.extended;
        for(var i in obj){
            klass[i] = obj[i];
        }
        if (extended) extended(klass)
    };

    klass.include = function(obj){
        var included = obj.included;
        for(var i in obj){
            klass.fn[i] = obj[i];
        }
        if (included) included(klass)
    };

    return klass;
};

  Demo:

var Person = new Class;
Person.include({
    init: function(name, age){
        this.name = name;
        this.age = Person.checkAge(age) ? age : null;
    },
    sayHello: function(){
        console.log("Hi , My name is " + this.name + (this.age ? ", i am " + this.age + " years old this year" : ""));
    }
});

Person.extend({
    needWater: true,
    checkAge: function(age){
        return age>0 && age < 150;
    }
});

var jim = new Person("Jim", 10);
jim.sayHello();
//output:Hi , My name is Jim, i am 10 years old this year

var tom = new Person("Tom", -1);
tom.sayHello();
//output:Hi , My name is Tom

  extend中是静态属性和方法,include中是实例属性和方法。

  当属性和方法与具体实例无关或是公用的时候,用静态属性和方法,否则用实例属性和方法。





本文转自Artwl博客园博客,原文链接:http://www.cnblogs.com/artwl/,如需转载请自行联系原作者

相关文章
|
2月前
|
Web App开发 JavaScript 前端开发
JavaScript 类(class)
JavaScript 类(class)
20 2
JavaScript 类(class)
|
2月前
|
JavaScript 前端开发 Java
JavaScript 类知识点概览
概览JavaScript中类的知识点,包括类的定义和实现、添加方法和get/set方法、类的继承和静态方法的使用。通过学生类和人员类的例子,演示了类的构造器、方法定义、继承关系和静态方法的调用。
JavaScript 类知识点概览
|
2月前
|
JavaScript 前端开发 开发者
JavaScript 类继承
JavaScript 类继承
18 1
|
2月前
|
JavaScript 前端开发
JavaScript基础知识-构造函数(也称为"类")定义
本文介绍了JavaScript中构造函数(也称为“类”)的定义和使用方法。
33 1
JavaScript基础知识-构造函数(也称为"类")定义
|
2月前
|
JavaScript 安全
ES6中JS类实现的解读
ES6中JS类实现的解读
21 2
|
2月前
|
JavaScript 前端开发 索引
|
26天前
|
前端开发 JavaScript 开发者
深入理解JavaScript中的对象与类
深入理解JavaScript中的对象与类
12 0
|
2月前
|
JavaScript 前端开发
JS中Promise的类式实现写法
JS中Promise的类式实现写法
|
2月前
|
C++ Windows
HTML+JavaScript构建C++类代码一键转换MASM32代码平台
HTML+JavaScript构建C++类代码一键转换MASM32代码平台
|
3月前
|
前端开发 JavaScript 开发者
【Web 前端】彻底告别“this”指向困扰:从零开始掌握 JavaScript 中“this”的奥秘
【8月更文挑战第23天】在 JavaScript 中,`this` 关键字的指向是根据其调用上下文动态确定的,这对于 Web 前端开发者而言是一项核心技能。本文通过多个示例解释了 `this` 的指向规则:在对象方法中指向该对象,在独立函数中指向全局对象或 `undefined`,在事件处理器中指向触发事件的 DOM 元素,在构造函数中指向新创建的对象。此外,还介绍了一些技巧,如使用箭头函数、`bind` 方法以及在事件处理器中显式保存 `this` 的引用,以帮助开发者更好地理解和控制 `this` 的指向。
42 1