第一份JS代码
/* 入职第一天写的js */
function checkName() {
// 验证姓名
}
function checkEmail() {
// 验证邮箱
}
function checkPassword() {
// 验证密码
}
队长点评:
你创建了太多变量!从功能上讲没问题,但在团队开发中这样的代码可能影响到其他人,如果别人也定义了同样的方法,将会导致相互覆盖的问题。
第二份JS代码
/* 2.用对象收编变量 */
var CheckOject = {
checkName : function(){
// 验证姓名
},
checkEmail : function(){
// 验证邮箱
},
checkPassword: function(){
// 验证密码
}
}
队长点评:
你看,这样对外我们就只有一个变量了。
第三份JS代码
/* 3.对象的另一种形式,函数对象 */
var CheckObject = function(){};
CheckObject.checkName = function(){
// 验证姓名
}
CheckOject.checkEmail = function(){
// 验证邮箱
}
CheckObject.checkPassword = function(){
// 验证密码
}
队长点评:
第二份和第三份代码都实现了全局变量的最小化,但当别人使用你这个对象类用new关键字创建新的对象时,新创建的对象是不能继承这些方法的。
第四份JS代码
/* 4.对象方法的简单复制 */
var CheckObject = function () {
return {
age : 0,
// 初值为0
checkName: function () {
// 验证姓名
},
checkEmail: function () {
// 验证邮箱
},
checkPassword: function () {
// 验证密码
}
}
}
var a = CheckObject();
a.age = 20;
var b = CheckObject();
b.age = 18;
var c = CheckObject();
console.log(a.age); // 20
console.log(b.age); // 18
console.log(c.age); // 0
队长点评:
当每次调用这个函数,就返回之前写的对象,而且是一个新的对象;这样每个人使用时就互不影响。
但这不是一个真正意义的类的创建方式,创建的对象a和CheckObject没有任何关系(返回出来的对象本身与CheckObject对象无关)。
第五份JS代码
/* 函数中使用this创建类*/*/
var CheckObject = function(){
this.checkName = function(){
// 验证姓名
}
this.checkEmail = function(){
// 验证邮箱
}
this.checkPassword = function(){
// 验证密码
}
}
var d = new CheckObject();
d.checkEmail();
队长点评:
把所有方法都放在函数内部,通过this定义,每次通过new关键字创建新对象的时候,新创建的对象都会对this上的属性进行复制。所以这些新创建的对象都会有自己的一套方法。然而有时候这么做造成的消耗是奢侈的。
第六份JS代码
/* 用原型创建类 */
var CheckObject = function(){};
CheckObject.prototype.checkName = function () {
// 验证姓名
}
CheckOject.prototype.checkEmail = function () {
// 验证邮箱
}
CheckObject.prototype.checkPassword = function () {
// 验证密码
}
var a = new CheckOject();
a.checkName();
a.checkEmail();
a.checkPassword();
队长点评:
如果你想把方法像JQuery一样链式的调用,可以试试
第七份JS代码
/* 用链式写法改造 */
var CheckObject = function(){};
CheckObject.prototype.checkName = function () {
// 验证姓名
return this;
}
CheckOject.prototype.checkEmail = function () {
// 验证邮箱
return this;
}
CheckObject.prototype.checkPassword = function () {
// 验证密码
return this;
}
var a = new CheckOject();
a.checkName().checkEmail().checkPassword();
队长点评:
小白,辛苦了,明天继续。( ˇˍˇ )
本文实例来源于张容铭大神写的《JavaScript设计模式》