JavaScript函數實現(xiàn)方式大總結，眾多的函數實現(xiàn)方式中，你現(xiàn)在用的是哪種？

一：例子需求分析

實現(xiàn)表單驗證功能，驗證用戶名、郵箱、密碼。

二：實現(xiàn)方案（13種）

①：全局函數方式

function checkName() {// 驗證姓名}function checkEmail() {// 驗證郵箱}function checkPassword() {// 驗證密碼}

②：全局函數的另一種形式

var checkName = function () {// 驗證姓名}var checkEmail = function () {// 驗證郵箱}var checkPassword = function () {// 驗證密碼}

③：用對象收編變量

var CheckObject = {checkName: function () {// 驗證姓名},checkEmail: function () {// 驗證郵箱},checkPassword: function () {// 驗證密碼}}

調用方法：CheckObject.checkName()

④：對象的另一種形式

var CheckObject = function () {}CheckObject.checkName = function () {// 驗證姓名}CheckObject.checkEmail = function () {// 驗證郵件}CheckObject.checkPassword = function () {// 驗證密碼}

⑤：真假對象

var CheckObject = function () {return {checkName: function () {// 驗證姓名},checkEmail: function () {// 驗證郵件},checkPassword: function () {// 驗證密碼}}}

調用方法：?

var a = CheckObject()a.checkEmail()

⑥：類的形式

var CheckObject = function () {this.checkName = function () {// 驗證姓名}this.checkEmail = function () {// 驗證郵箱}this.checkPassword = function () {// 驗證密碼}}

調用方法：

var a = new CheckObject()a.checkEmail()

⑦：類的形式結合prototype

var CheckObject = function () {}CheckObject.prototype.checkName = function () {// 驗證姓名}CheckObject.prototype.checkEmail = function () {// 驗證郵箱}CheckObject.prototype.checkPassword = function () {// 驗證密碼}

調用方法：見⑧

⑧：⑦的簡化寫法

var CheckObject = function () {}CheckObject.prototype = {checkName: function () {// 驗證姓名},checkEmail: function () {// 驗證郵箱},checkPassword: function () {// 驗證密碼}}

調用方法：

var a = new CheckObject()a.checkName()a.checkEmail()a.checkPassword()

⑨：基于⑧實現(xiàn)鏈式調用

var CheckObject = function () {}CheckObject.prototype = {checkName: function () {// 驗證姓名return this},checkEmail: function () {// 驗證郵箱return this},checkPassword: function () {// 驗證密碼return this}}

調用方法：

var a = new CheckObject()a.checkName().checkEmail().checkPassword()

⑩：簡單粗暴地對函數的祖先進行擴展（一般不建議）

Function.prototype.checkEmail = function () {// 驗證郵箱}

調用方法：

var f = function () {}f.checkEmail()或var f = new Function()f.checkEmail()

(11)：優(yōu)雅地對函數祖先進行擴展

Function.prototype.addMethod = function (name, fn) {this[name] = fn}// 往addMethod中添加方法var methods = new Function() 或 var methods = function () {}methods.addMethod('checkEmail', function () {// 驗證郵箱})methods.addMethod('checkName', function () {// 驗證姓名})

調用方法：

methods.checkName()methods.checkEmail()

(12)：鏈式地對函數祖先進行擴展、鏈式調用

Function.prototype.addMethod = function (name, fn) {this[name] = fnreturn this}var methods = new Function()methods.addMethod('checkName', function () {// 驗證姓名return this}).addMethod('checkEmail', function () {// 驗證郵箱return this}).addMethod('checkPassword', function () {// 驗證密碼return this})

調用方法：

methods.checkName().checkEmail().checkPassword()

(13)：將(12)改為類式調用

Function.prototype.addMethod = function (name, fn) {this.prototype[name] = fnreturn this}var Methods = new Function()Methods.addMethod('checkName', function () {// 驗證姓名return this}).addMethod('checkEmail', function () {// 驗證郵箱return this}).addMethod('checkPassword', function () {// 驗證密碼return this})

調用方法：

var m = new Methods()m.checkName().checkEmail().checkPassword()

總結：

JavaScript是一門很靈活的語言，“靈活性”是這門語言特有的氣質。

上邊的小需求你來實現(xiàn)的時候，用的是哪種寫法呢？歡迎交流交流~~

學習交友：

總結

以上是生活随笔為你收集整理的JavaScript函数实现方式大总结的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。