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创建的匿名对象作为返回值。
写个小例子验证一下
javascript 命名空间的实例应用的更多相关文章
- Google Map JavaScript API V3 实例大全
Google Map JavaScript API V3 实例大全 基础知识 简单的例子 地理位置 语言 位置 坐标 简单的投影 事件 简单事件 关闭事件 多次添加事件 事件属性 控制 php禁用ui ...
- javaScript 面向对象开发实例
javaScript 面向对象开发实例 这个是结合require的模块化开发,首先创建构造函数: //test.js 1 function Test(lists) { var config={ nam ...
- JavaScript命名空间的理解与实现
命名空间有效防止函数名/类名和其他人的冲突,在使用多个第三方框架或类库的时候,一旦冲突,唯一能作的就是放弃其中一个.从事Web开发不可避免要接触JavaScript,目前最新版本的JavaScript ...
- javascript“命名空间”的费曼输出[原创]
Javascript由于没有命名空间的概念,所以好多的框架或库就用了某些“命名空间”的技巧.在学习作为函数的命名空间时,我翻阅了好多的书本和blog,很多的概念和说明都是要么过于烦杂或过于简单.现在由 ...
- 关于Javascript中通过实例对象修改原型对象属性值的问题
Javascript中的数据值有两大类:基本类型的数据值和引用类型的数据值. 基本类型的数据值有5种:null.undefined.number.boolean和string. 引用类型的数据值往大的 ...
- JavaScript模板引擎实例应用
在之前的一篇名为<移动端基于HTML模板和JSON数据的JavaScript交互>的文章中,我向大家说明了为什么要使用JavaScript模板以及如何使用,文末还提到了laytpl.art ...
- JavaScript学习笔记-实例详解-类(一)
实例详解-类(一): //每个javascript函数(除了bind())都自动拥有一个prototype对象// 在未添加属性或重写prototype对象之前,它只包含唯一一个不可枚举属性const ...
- Javascript DOM操作实例
最近在学DOM,但是还是没有办法很好的记住API,想找些例子来练习,网上的例子将一个个DOM对象方法挨个举例,并没有集合在一起用,效果不尽人意.所以自己写一份实例,顺便巩固下学到的知识. ...
- Javascript 命名空间模式
命名空间是通过为项目或库创建一个全局对象,然后将所有功能添加到该全局变量中.通过减少程序中全局变量的数量,实现单全局变量,从而在具有大量函数.对象和其他变量的情况下不会造成全局污染,同时也避免了命名冲 ...
随机推荐
- Why am I able to change the contents of const char *ptr?
http://stackoverflow.com/questions/3228664/why-am-i-able-to-change-the-contents-of-const-char-ptr I ...
- apache 多域名配置
一直不明白apache多域名配置的问题,所以只能用不同的端口来配置,现在终于搞懂了一点 首先,开启apache的vhost模块 找到配置文件httpd.conf中的下面两行 #LoadModule v ...
- Unity3d Android程序嵌入Admob广告条
原地址:http://dong2008hong.blog.163.com/blog/static/4696882720140441353482/ Seems like using a simple A ...
- Nagios 安装及微信短信提醒
引言 Nagios 作为业界非常强大的一款开源监视系统. 监控网络服务(SMTP.POP3.HTTP.NNTP.PING 等): 监控主机资源(处理器负荷.磁盘利用率等): 简单地插件设计使得用户可以 ...
- [转载]Spring Annotation Based Configuration
Annotation injection is performed before XML injection, thus the latter configuration will override ...
- POJ 3273
Monthly Expense Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 12122 Accepted: 4932 ...
- Javascript 绝对定位和相对定位
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- 深入浅出ES6(六):解构 Destructuring
作者 Jason Orendorff github主页 https://github.com/jorendorff 什么是解构赋值? 解构赋值允许你使用类似数组或对象字面量的语法将数组和对象的属性 ...
- React vs Angular 2: 冰与火之歌
黄玄 · 3 个月前 本文译自 Angular 2 versus React: There Will Be Blood ,其实之前有人翻译过,但是翻得水平有一点不忍直视,我们不希望浪费这篇好文章. 本 ...
- Ping 命令
Ping”命令是我们在判断网络故障常用的命令 它是用来检查网络是否通畅或者网络连接速度的命令. 它所利用的原理是这样的:网络上的机器都有唯一确定的IP地址,我们给目标IP地址发送一个数据包, 对方就要 ...