javascript 命名空间的实例应用

/**
* 创建全局对象MYAPP
* @module MYAPP
* @title MYAPP Global
*/
var MYAPP = MYAPP || {};

/**
* 返回指定的命名空间,如果命名空间不存在则创建命名空间。
* 备注:命名时需小心,注意保留关键字,可能在一些浏览器无法使用。
*
* @method namespace
* @param {String *} 至少需要创建一个命名空间
* @return {Object} 最后一个命名空间创建的对象的引用
*/
MYAPP.namespace = function(str){
    var parts = str.split("."),
    parent = MYAPP,
    i=0,
    l=0;

    if(parts[0]==="MYAPP"){
        parts = parts.slice(1);
    }
    for(i=0,l=parts.length; i<l;i++){
        if(typeof parent[parts[i]] === "undefined"){
            parent[parts[i]] = {};
        }
        parent = parent[parts[i]];
    }
    return parent;
}

/**
* bfun是Basic Functions Extended的缩写
* 作用:包括数组、字符串等等数功能扩展
*
* @module bfun
*/
MYAPP.bfun = {
    array:(function(){
        return {
            /**
            * @method isArray 判断是否为数组
            * @param {Array} 数组
            * @return {Boolean} 真返回true,否则返回false
            */
            isArray: function(){
                return Object.prototype.toString.call(arguments[0])  === ‘[object Array]‘;
            },
            /**
            * @method inArray 检查值是否在数组中
            * @param {value,Array} 值,数组
            * @return {Boolean} 真返回true,否则返回undefined
            */
            inArray: function(val,arr){
                for(var i=0,l=arr.length;i<l;i++){
                    if(arr[i] === val){
                        return true;
                    }
                }
            }
        }
    })(),
    string:(function(){
        return {
            /**
            * @method trim 过滤字符串两边多余的空格
            * @param {String} 字符串
            * @return {String} 字符串
            */
            trim: function(){
                return arguments[0].replace(/(^\s*)|(\s*$)/g, "");
            },
            /**
            * @method ltrim 过滤字符串左边多余的空格
            * @param {String} 字符串
            * @return {String} 字符串
            */
            ltrim: function(){
                return arguments[0].replace(/^s+/g, "");
            },
            /**
            * @method rtrim 过滤字符串右边多余的空格
            * @param {String} 字符串
            * @return {String} 字符串
            */
            rtrim: function(){
                return arguments[0].replace(/s+$/g, "");
            }
        }
    })()
}

// 测试
MYAPP.test = {
    init: function(){
        // 使用对应的模块先引用
        var marray = MYAPP.namespace("MYAPP.bfun.array");
        var mstring = MYAPP.namespace("MYAPP.bfun.string");

        var arr =  ["a","b"];
        var str = "   abc  ";

        console.log("判断是否为数组:" + marray.isArray(arr));
        console.log("值是否在数组中:" + marray.inArray("a",arr));
        console.log("过滤左右空格:" + mstring.trim(str));
    }
}

MYAPP.test.init();

写几个有用的函数

querySelector和querySelectorAll是W3C提供的新的查询接口,但是名字好长,自己写个简单的,innerHTML属性也常用到,写个简单版仿jQuery的html方法

(function () {
            var _NS = function () {

            }

            _NS.prototype.select = function (selector,context) {
                var context = context || document;
                return context.querySelectorAll(selector);
            }

            _NS.prototype.isArrayLike=function(obj){
                if(obj instanceof Array){
                    return true;
                }

                var length=obj.length;
                if ( obj.nodeType === 1 && length ) {
                    return true;
                }
                return false;
            }

            _NS.prototype.html = function (obj,value) {
                var isArray=this.isArrayLike(obj), i=0;

                if (typeof value == ‘string‘) {
                    if (!isArray) {
                        obj.innerHTML = value;
                    } else {
                        var length = obj.length;
                        while (i < length) {
                            obj[i].innerHTML = value;
                            i += 1;
                        }
                    }
                } else {
                    if (!isArray) {
                        return obj.innerHTML;
                    } else {
                        return obj[0].innerHTML;
                    }
                }
            }

            window.NS = new _NS();
        })();

构造函数的一些知识

想要做到上面几点除了prototype等基本知识,还需要了解一些关于JavaScript构造函数的知识。

1.什么样的函数是构造函数

在JavaScript的世界里构造函数并不神秘,也不特殊,任何函数通过new 操作符调用都可以变为构造函数,不使用new 操作符就不是构造函数,而是直接按普通函数调用。

2.构造函数返回什么样的结果

构造函数的返回值分为两种情况,当function没有return语句或者return回一个基本类型(bool,int,string,undefined,null)的时候,返回new 创建的一个匿名对象,该对象即为函数实例;如果function体内return一个引用类型对象(Array,Function,Object等)时,该对象会覆盖new创建的匿名对象作为返回值。

写个小例子验证一下

时间: 2024-08-29 14:06:32

javascript 命名空间的实例应用的相关文章

JavaScript发布/订阅实例

原文链接: Pub/Sub JavaScript Object原文日期: 2014年6月11日翻译日期: 2014年6月13日 翻译人员: 铁锚 高效AJAX网站的三大杀器: 事件代理, 浏览历史管理, 以及高效应用级 发布/订阅通信机制. 本博客的原文站点 同时使用了这三种技术,本文中作者将分享其中最简单的一个: 该网站使用的 一个微型 发布/订阅模块. 如果你不了解 发布/订阅 模式,那么可以将其类比为 你发表了一篇博文,所有人都可以订阅你的博客, 也类似于广播电台的工作方式: 有一个站台进

javaScript 面向对象开发实例

javaScript 面向对象开发实例 这个是结合require的模块化开发,首先创建构造函数: //test.js 1 function Test(lists) { 2 var config={ 3 name:lists.name, 4 sex:lists.sex 5 }; 6 this.init(config) 7 } 8 Radio.prototype = { 9 init: function(config) { 10 var self=this; 11 self.initContent(

【javascript】javascript常见正则表达式实例

javascript常见正则表达式实例 实例来源 1 var myRegExp = { 2 // 检查字符串是否为合法QQ号码 3 isQQ: function(str) { 4 // 1 首位不能是0 ^[1-9] 5 // 2 必须是 [5, 11] 位的数字 \d{4, 9} 6 var reg = /^[1-9][0-9]{4,9}$/gim; 7 if (reg.test(str)) { 8 console.log('QQ号码格式输入正确'); 9 return true; 10 }

javascript继承简单实例

javascript继承简单实例: 作为一门面向对象的语言,那么继承自然就是一大特征,下面是一段非常简单代码实例,它演示了实现继承的基本原理,有兴趣的或者恰好要学习此方面的朋友可以参阅一下,希望能够给大家来帮组. //继承 function Person(name,sex) { this.name=name; this.sex=sex; } Person.prototype.sayName=function() { alert(this.name); } Person.prototype.say

javascript命名空间

命名空间:命名空间有助于减少程序中所需要的全局变量的数量,并且同时还有助于避免命名冲突或过长的名字前缀. var MYAPP = MYAPP || {}; MYAPP.namespace = function(ns_string){ var parts = ns_string.split('.'), parent = MYAPP, i; if( parts[0] === 'MYAPP'){ parts = parts.slice(1); } for(var i=0; i<parts.length

017:应用命名空间和实例命名空间

应用命名空间和实例命名空间: 什么是实例命名空间:就是多个url映射到同一个app上,如下代码便是: path('cms1/', include('cms.urls')), path('cms2/', include('cms.urls')), 如下图: 基于上节(应用命名空间——016)的情况会出现什么情况呢? 1.想看一下cms里的情况,如下图: 访问:http://127.0.0.1:8000/cms1/跳转到:http://127.0.0.1:8000/cms1/login/  :但是访

javascript“命名空间”的费曼输出[原创]

Javascript由于没有命名空间的概念,所以好多的框架或库就用了某些“命名空间”的技巧.在学习作为函数的命名空间时,我翻阅了好多的书本和blog,很多的概念和说明都是要么过于烦杂或过于简单.现在由我来进行一个的系统的描述和介绍. 一.浏览器启动后的初步理解 1.我们要上网,就要打开浏览器,输入网址,浏览器就负责渲染和相应用户的鼠标动作.而打开浏览器这个进程后,浏览器的网络线程负责解析网址为ip地址,去网页服务器下载网页文件到本地硬盘,我就称这个线程是network线程:另外一个线程是负责解析

关于Javascript中通过实例对象修改原型对象属性值的问题

Javascript中的数据值有两大类:基本类型的数据值和引用类型的数据值. 基本类型的数据值有5种:null.undefined.number.boolean和string. 引用类型的数据值往大的说就1种,即Object类型.往细的说有:Object类型.Array类型.Date类型.Regexp类型.Function类型等. 当原型对象的属性值为基本类型的数据值时,通过实例对象修改属性值从而引起原型对象的属性值发生变化的情况不会发生.当原型对象的属性值为引用类型的数据值时,通过实例对象修改

JavaScript String 对象实例深入研究

本文主要介绍并分析JavaScript中String对象的具体用法,以及和String对象相关的方法,方便开发者在JavaScript开发中更好地处理字符串. 1. 介绍 String 对象,对字符串进行操作,如:截取一段子串.查找字符串/字符.转换大小写等等. 2. 定义方式 2.1 new String(Value) 构造函数:返回一个内容为Value的String对象参数: ①value {String} :字符串 返回值: {String对象} 返回一个内容为Value的String对象