JavaScript对象创建的几种方式学习总结
1.通过 对象字面量 创建单例对象
/**
* Created by kikop on 2018/2/25.
*/
var objectLiteralManager = {
//如何设置私有是关键,函数中使用时,加 this 限定
defaultName: null,
defaultArray: [],
setName: function (tmpDefaultName) {
this.defaultName = tmpDefaultName;
},
setArray: function (tmpArrays) {
for (var i = 0; i < tmpArrays.length; i++) {
this.defaultArray.push(tmpArrays[i]);
}
},
getName: function () {
//1.正确判断方式
//if (null == this.defaultName) {
// this.defaultName = 'undefine value.';
//}
return this.defaultName;
},
getName_Global: function () {
//1.正确判断方式
//if(null ==this.defaultName){
// this.defaultName='undefine';
//}
//return this.defaultName;
//2.错误使用,这里容易出错
// 不加this ,这里 defaultName是 全局的
defaultName = 'hello';
if (defaultName == undefined) {
defaultName = 'undefine';
}
return this.defaultName;
},
};
//调试
$(function () {
//objectLiteralManager.setName('hello,objectLiteralManager');
//console.log(objectLiteralManager.getName());
//
//objectLiteralManager.setArray(['a', 'b', 'c']);
//console.log(objectLiteralManager.defaultArray);
})
2.简单模块模式
function BaseComponent() {
}
function OtherComponent() {
}
//先赋值(返回对象的匿名函数)函数表达式,再执行
var simpleModulePattern = function () {
//1.定义私有变量
var privateVar = 10;
var components = new Array();
//初始化
components.push(new BaseComponent());
//2.定义私有函数
function privateFunc() {
console.log('privateFunc...')
//return false;
}
//3.返回共用方法和属性
return {
publicProperty: true,
publicMethod: function () {
//privateVar++;
//指向 私有方法
return privateFunc();
},
getComponentCount: function () {
return components.length;
},
registerComponent: function (component) {
if (typeof component == "object") {
components.push(component);
}
}
}
}();
//调试
$(function () {
//simpleModulePattern.publicMethod();
//
//simpleModulePattern.publicProperty=false;
//console.log(simpleModulePattern.publicProperty);
//
//
//
//console.log(simpleModulePattern instanceof Object);
//console.log(simpleModulePattern.getComponentCount());
//simpleModulePattern.registerComponent(new OtherComponent());
//console.log(simpleModulePattern.getComponentCount());
})
3.增强型模块模式
var advModulePattern = function () {
//1.定义私有变量
var components = new Array();
//初始化
components.push(new BaseComponent());
var app = new BaseComponent();
app.getComponentCount = function () {
return components.length;
};
app.registerComponent = function (component) {
if (typeof component == "object") {
components.push(component);
}
};
//3.返回该类型的 app
return app;
}(); //立即执行
//调试
$(function () {
//alert(advModulePattern instanceof BaseComponent);
//advModulePattern.registerComponent(new OtherComponent());
//alert(advModulePattern.getComponentCount()); //2
});
4.属于实例的私有变量
function Person(name) {
//1.定义私有变量
var privateVar = 10;
//2.定义私有函数
function privateFunc() {
//在函数 Person内部可以访问 privateVar
privateVar++;
console.log('privateFunc...' + privateVar)
}
//3.定义特权方法
this.getName = function () {
return name;
};
this.setName = function (tmpName) {
name = tmpName;
};
this.privateFuncWrap = function () {
return privateFunc();
}
}
//调试
$(function () {
//var p1 = new Person('kikop');
//console.log(p1.getName());
//p1.privateFuncWrap();
//
//var p2 = new Person('kikop2');
//console.log(p2.getName());
//p2.privateFuncWrap();
});
5.块级作用域(又叫私有作用域)
(function () {
//定义 块级作用域
console.log('here is private range!');
})();
6.总结
//函数声明后面不可以跟圆括号
//函数表达式后面可以跟圆括号
//函数声明加个括号则被提升为函数表达式
