博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
requirejs amd module load example
阅读量:5058 次
发布时间:2019-06-12

本文共 6737 字,大约阅读时间需要 22 分钟。

 

/** * This example make use of requireJS to provide a clean and simple way to split JavaScript class definitions * into separate files and avoid global namespace pollution.  http://requirejs.org/ * * We start by defining the definition within the require block inside a function; this means that any * new variables / methods will not be added to the global namespace; requireJS simply requires us to return * a single value (function / Object) which represents this definition.  In our case, we will be returning * the Class' function. */define(function () {    // Forces the JavaScript engine into strict mode: http://tinyurl.com/2dondlh    "use strict";    /**     * This is our classes constructor; unlike AS3 this is where we define our member properties (fields).     * To differentiate constructor functions from regular functions, by convention we start the function      * name with a capital letter.  This informs users that they must invoke the Person function using     * the `new` keyword and treat it as a constructor (ie: it returns a new instance of the Class).     */    function Person(name) {        // This first guard ensures that the callee has invoked our Class' constructor function        // with the `new` keyword - failure to do this will result in the `this` keyword referring         // to the callee's scope (typically the window global) which will result in the following fields        // (name and _age) leaking into the global namespace and not being set on this object.        if (!(this instanceof Person)) {            throw new TypeError("Person constructor cannot be called as a function.");        }        // Here we create a member property (field) for the Person's name; setting its value        // what the one supplied to the Constructor.  Although we don't have to define        // properties ahead of time (they can easily be added at runtime as all Object / functions         // in JavaScript are dynamic) I believe it makes your code easier to follow if you list your        // classes intentions up front (eg: in the Constructor function).        this.name = name;        // Here we are defining a private member. As there is no `private` keyword in JavaScript        // there is no way for us to hide this data (without resorting to inelegant hacks); instead        // we choose to use a naming convention where a leading underscore indicates a property        // is private and should not be relied upon as part of the Classes public API.        this._age = -1;    }    /**     * Adding static properties is as simple as adding them directly to the constructor     * function directly.     */    Person.RETIREMENT_AGE = 60;    /**     * Public Static methods are defined in the same way; here's a static constructor for our Person class     * which also sets the person's age.     */    Person.create = function (name, age) {        var result = new Person(name);        result.setAge(age);        return result;    };    /**     * Any functions not added to the Person reference won't be visible, or accessible outside of     * this file (closure); however, these methods and functions don't belong to the Person class either     * and are static as a result.     */    function formatNameAndAge(person) {        // Note that `this` does not refer to the Person object from inside this method.        if (person._age === -1) {            return "We don't know how old " + person.name + " is!";        }        return (person.name + ", is " + person._age + " years old and "            + ((person.canRetire()) ? "can" : "can't") + " retire");    };    /**     * The prototype is a special type of Object which is used as a the blueprint for all instances     * of a given Class; by defining functions and properties on the prototype we reduce memory     * overhead.  We can also achieve inheritance by pointing one classes' prototype at another, for     * example, if we introduced a BankManager class which extended our Person class, we could write:     *     *	`BankManager.prototype = Person.prototype`     *	`BankManager.prototype.constructor = BankManager`     *     * However, due to the dynamic nature of JavaScript I am of the opinion that favouring composition     * over inheritance will make your code easier to read and re-use.     */    Person.prototype = {    	    	/**    	 * Whenever you replace an Object's Prototype, you need to repoint    	 * the base Constructor back at the original constructor Function,     	 * otherwise `instanceof` calls will fail.    	 */    	constructor: Person,    	        /**         * All methods added to a Class' prototype are public (visible); they are able to          * access the properties and methods of the Person class via the `this` keyword.  Note that         * unlike ActionScript, usage of the `this` keyword is required, failure to use it will          * result in the JavaScript engine trying to resolve the definition on the global object.         */        greet: function () {            // Note we have to use the `this` keyword.            return "Hello, " + this.name;        },        /**         * Even tho the `_age` property is accessible; it still makes a lot of sense to provide         * mutator methods (getters / setters) which make up the public API of a Class - here we         * validate the supplied value; something you can't do when a field is modified directly         */        setAge: function (value) {            // Ensure the supplied value is numeric.            if (typeof (value) !== 'number') {                throw new TypeError(typeof (value) + " is not a number.");            }            // Ensure the supplied value is valid.            if (isNaN(value) || value < 0) {                throw new RangeError("Supplied value is out of range.");            }            this._age = value;        },        /**         * This method access both a member property and a static property.         */        canRetire: function() {            return this._age >= Person.RETIREMENT_AGE;        },        /**         * Finally we can also access 'static' functions and properties.         */        toString: function() {            // Note that as `formatNameAndAge` is static we must supply a reference            // to `this` so it can operate on this instance.            return formatNameAndAge(this);        }    };    // As mentioned up top, requireJS needs us to return a value - in this files case, we will return    // a reference to the constructor function.    return Person;});

  使用:

require(['site'],function(Person){        var jonny = new Person("Jonny");        jonny.setAge(29);        console.log(jonny.toString());    });

  

 

转载于:https://www.cnblogs.com/meetrice/p/9348730.html

你可能感兴趣的文章
软件目录结构规范
查看>>
Windbg调试Sql Server 进程
查看>>
linux调度器系列
查看>>
mysqladmin
查看>>
解决 No Entity Framework provider found for the ADO.NET provider
查看>>
SVN服务器搭建和使用(三)(转载)
查看>>
Android 自定义View (三) 圆环交替 等待效果
查看>>
设置虚拟机虚拟机中fedora上网配置-bridge连接方式(图解)
查看>>
HEVC播放器出炉,迅雷看看支持H.265
查看>>
[置顶] Android仿人人客户端(v5.7.1)——人人授权访问界面
查看>>
Eclipse 调试的时候Tomcat报错启动不了
查看>>
【安卓5】高级控件——拖动条SeekBar
查看>>
ES6内置方法find 和 filter的区别在哪
查看>>
Android入门之文件系统操作(二)文件操作相关指令
查看>>
Android实现 ScrollView + ListView无滚动条滚动
查看>>
java学习笔记之String类
查看>>
pymysql操作mysql
查看>>
Linux服务器删除乱码文件/文件夹的方法
查看>>
牛腩记账本core版本源码
查看>>
Word Break II
查看>>