/* 单纯的函数方法的罗列写法 ,造成全局变量的污染*/
function checkName() { }
function checkEmail() { }
function checkPassWord() { }
/* 放在一个对象下面,作为该对象的方法 */
var CheckObject = {
checkName() { },
checkEmail() { },
checkPassWord() { }
}
let obj = CheckObject
console.log(obj.checkName) //ƒ checkName() { }
/* 函数也是对象,方法写在函数上,是无法被复制的 */
var CheckObject = function () { }
CheckObject.checkName = function () { }
CheckObject.checkEmail = function () { }
CheckObject.checkPassWord = function () { }
let myObj = CheckObject
console.log(myObj.checkName) //ƒ () { }
/* 改造上面的方法 */
var CheckObject = function () {
return {
checkName() { },
checkEmail() { },
checkPassWord() { }
}
}
var c = CheckObject()
console.log(c.checkEmail) //ƒ checkEmail() { }
//构造函数的类
var MyObject = function () {
this.checkName = function () {
console.log('checkName----')
}
this.checkEmail = function () { }
this.checkPassWord = function () { }
}
console.log(MyObject)
let me = new MyObject()
me.checkName() //checkName----
/* 这样new出来的每个实例对象都有自己的一套方法,会造成资源的浪费,共用方法
我们还是要写在prototype
*/
var CheckObj = function () { }
CheckObj.prototype.checkName = function () { }
CheckObj.prototype.checkEmail = function () { }
CheckObj.prototype.checkPassWord = function () { }
/* 简写方式 ,与上面的方式不能混着用,否则会覆盖*/
var CheckObj = function () { }
CheckObj.prototype = {
checkName() { return this },
checkEmail() { return this },
checkPassWord() { return this }
}
var a = new CheckObj()
a.checkName()
a.checkEmail()
a.checkPassWord()
/* 上面的方法重复写了三次a */
var CheckObj = function () { }
CheckObj.prototype = {
checkName() { return this },
checkEmail() { return this },
checkPassWord() { return this }
}
var a = new CheckObj()
a.checkEmail().checkName().checkPassWord()
/* 在原生的function上给所有的函数添加一个方法 */
Function.prototype.checkEmail = function () {
console.log("from prototype")
}
let test = function () { }
test.checkEmail() //from prototype
/* 上面额操作是不允许的,污染了原生的 */
/* 抽象出一个统一添加方法的功能s */
Function.prototype.addMethod = function (name, fn) {
this[name] = fn
//想链式添加的话,在后面return this
return this
}
let test1 = function () { }
test1.addMethod('checkName', function () {
console.log('我的是被天机上来')
//想链式使用的话,也是
return this
}).addMethod('checkEmail', function () {
console.log('我的是email')
return this
})
test1.checkName().checkEmail() //我的是被天机上来
//我的是被天机上来
//我的是email
/* 上面是函数式的调用,如果要用new方法来实现呢 */
Function.prototype.addMethod = function (name, fn) {
this.prototype[name] = fn
//想链式添加的话,在后面return this
return this
}
let Test2 = function () {
}
Test2.addMethod('checkName', function () {
console.log('checkName')
return this
}).addMethod('checkEmail', function () {
console.log('checkEmail')
return this
})
let m = new Test2()
m.checkEmail().checkName()
/* checkEmail
checkName */
原生js的设计莫之函数使用的几种方式
最新推荐文章于 2024-10-10 10:50:43 发布