javaScript中的函數應用

Michael_Ding 發布于2019-08-20 14:21 / 2800人閱讀

摘要：概要當中的函數站在不同的角度有不同的分類和應用本文站在高階函數的角度來討論當中函數的應用場景。解決老版本瀏覽器函數兼容性問題判斷數據類型高階函數實現也就是面向切面編程在中這個概念基礎且重要。

概要

js當中的函數站在不同的角度有不同的分類和應用,本文站在高階函數的角度來討論js當中函數的應用場景。

首先明確高階函數定義:

函數可以作為參數被傳遞

函數可以作為返回值輸出

應用場景 函數作為參數被傳遞

這種情況其實是比較常見的,日常用的挺多的,例如ajax請求成功之后的callback函數、各種插件,框架當中的鉤子函數等等。下面舉個我們常用的例子:

var tmpAry=[2,1,3];

tmpAry.sort(function(a,b){
    return a-b;
});
console.log(tmpAry);   //[1,2,3]

目的:把函數中易變或公用邏輯抽離,封裝成函數參數,隔離變與不變部分,達到更好的封裝和復用。

函數作為返回值輸出

這個其實我在日常寫代碼中用的比較少,但并不能說明這個不常見,所以下面我會多舉幾個例子。

解決老版本瀏覽器bind函數兼容性問題

Function.prototype.bind=function(context){
    var self=this;
    return function(){
        return self.apply(context,args);
    }
}

判斷數據類型

var isType=function(type){
    return function(obj){
        return Object.prototype.toString.call(obj)==="[object "+ type + "]";
    }
}
var isString=isType("String");
console.log(isString("gcy"));  //true

高階函數實現aop

AOP也就是面向切面編程,在java中這個概念基礎且重要。具體就是通過reflect或動態代理(jdk動態代理和cglib動態代理)動態的在業務函數之前或之后添加一些
可復用的代碼邏輯,例如典型的日志統計、權限控制等等。用aop的目的就是希望業務邏輯模塊高內聚,同時達到非業務公共模塊可復用,易維護。

Function.prototype.before=function (beforefn) {
    var _self=this;//保存原函數的引用
    return function () {  //代理函數
        beforefn.apply(this,arguments);
        _self.apply(this,arguments);
    }
};

Function.prototype.after=function (afterfn) {
    var _self=this;
    return function () {
        var ret=_self.apply(this,arguments);
        afterfn.apply(this,arguments);
        return ret;  //執行原函數,并返回原函數的執行結果
    }
}
var  func=function () {
    console.log("ing");
}
func=func.before(function () {
    console.log("before")
}).after(function () {
    console.log("after");
})
func(); //before  ing  after

這個其實有很多應用場景,比如統計函數執行時間,動態改變函數參數等等。

function currying

首先currying的概念是部分求值,具體含義就是指動態的接受一些參數,不立即求值,在需要計算求值時訪問之前閉包中保存的參數,一次性進行求值。
下面是一個部分求值通用的currying函數。

var currying=function (fn) {
    var args=[];
    return function () {
        if(arguments.length===0){
            return fn.apply(this,args);
        }else{
            [].push.apply(args,arguments);
            return arguments.callee;  //指向當前匿名函數,以便于參數連續暫存
        }
    }
}
var cost=(function () {
    var money=0;
    return function () {
        for(var i=0,len=arguments.length;i
總結
其實高階函數應用場景很多,我只是總結列舉了一些自己學習中碰到的典型例子,以后遇到一些適當的,會繼續完善。

GPU云服務器云服務器 javascript中的函數 javascript中的 php中的變量函數 java中的根號函數

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/81569.html

前端每周清單半年盤點之 JavaScript 篇

摘要：前端每周清單專注前端領域內容，以對外文資料的搜集為主，幫助開發者了解一周前端熱點分為新聞熱點開發教程工程實踐深度閱讀開源項目巔峰人生等欄目。背后的故事本文是對于年之間世界發生的大事件的詳細介紹，闡述了從提出到角力到流產的前世今生。前端每周清單專注前端領域內容，以對外文資料的搜集為主，幫助開發者了解一周前端熱點；分為新聞熱點、開發教程、工程實踐、深度閱讀、開源項目、巔峰人生等欄目。歡迎...

Vixb 2019-08-21 12:04 評論0 收藏0
【譯】每個JavaScript 開發者應該了解的10個面試題

摘要：避免脆弱的基類問題。紅牌警告沒有提到上述任何問題。單向數據流意味著模型是單一的事實來源。單向數據流是確定性的，而雙向綁定可能導致更難以遵循和理解的副作用。原文地址 1. 你能說出兩種對 JavaScript 應用開發者而言的編程范式嗎？希望聽到： 2. 什么是函數編程？希望聽到： 3. 類繼承和原型繼承的不同？希望聽到 4. 函數式編程和面向對象編程的優缺點？ ...

mykurisu 2019-05-22 18:24 評論0 收藏0
學習React之前你需要知道的的JavaScript基礎知識

摘要：和類在開始時遇到類組件，只是需要有關類的基礎。畢竟，中的條件呈現僅再次顯示大多數是而不是特定的任何內容。在我的研討會期間，更多的材料是關于JavaScript而不是React。其中大部分歸結為JavaScript ES6以及功能和語法，但也包括三元運算符，語言中的簡寫版本，此對象，JavaScript內置函數（map，reduce，filter）或更常識性的概念，如：可組合性，可重用...

bitkylin 2019-08-02 11:01 評論0 收藏0
Express 實戰（一）：概覽

摘要：一個標準性的事件就是年的橫空出世。引擎快速處理能力和異步編程風格，讓開發者從多線程中解脫了出來。其次，通過異步編程范式將其高并發的能力發揮的淋漓盡致。它也僅僅是一個處理請求并作出響應的函數，并無任何特殊之處。 showImg(https://segmentfault.com/img/remote/1460000010819116); 在正式學習 Express 內容之前，我們有必要從大...

zhaochunqi 2019-08-20 18:53 評論0 收藏0
JavaScript 編程精解中文第三版十二、項目：編程語言

摘要：來源編程精解中文第三版翻譯項目原文譯者飛龍協議自豪地采用谷歌翻譯部分參考了編程精解第版確定編程語言中的表達式含義的求值器只是另一個程序。若文本不是一個合法程序，解析器應該指出錯誤。來源：ApacheCN『JavaScript 編程精解中文第三版』翻譯項目原文：Project: A Programming Language 譯者：飛龍協議：CC BY-NC-SA 4.0 自豪地采用...

Near_Li 2019-08-23 18:20 評論0 收藏0