導入
この記事では、主に機能で使用されるいくつかの手法を紹介します(パート1)。関数機能を使用して、非常に興味深いコードをたくさん書くことができます。この記事には、主にコールバックモード、構成オブジェクト、戻り機能、配布プログラム、カレーが含まれます。
コールバック関数
JavaScriptでは、関数Aが別の関数Bのパラメーターの1つである場合、関数Aはコールバック関数と呼ばれます。つまり、関数Bの期間内で実行できます(開始、中間、および終了の両方)。
たとえば、ノードを生成する関数があります
コードコピーは次のとおりです。
var complexComputation = function(){ /*内部的にハンドルし、ノードを返します* /};
すべてのノードを見つけてから、コールバックコールバックを介してコードを実行するためのFindNodes関数宣言があります。
コードコピーは次のとおりです。
var findnodes = function(callback){
var nodes = [];
var node = complexComputation();
//コールバック関数が利用可能な場合は、実行してください
if(typeof callback === "function"){
コールバック(ノード);
}
nodes.push(node);
ノードを返します。
};
コールバックの定義に関して、使用するために事前に定義できます。
コードコピーは次のとおりです。
//コールバックを定義します
var hide = function(node){
node.style.display = "none";
};
//ノードを見つけて、すべてのノードを非表示にします
var hiddennodes = findnodes(hide);
次のように、呼び出すときに匿名の定義を直接使用することもできます。
コードコピーは次のとおりです。
//匿名関数を使用してコールバックを定義します
var blocknodes = findnodes(function(node){
node.style.display = 'block';
});
最も一般的に使用されるものは、おそらくjqueryのajaxメソッドへの呼び出しです。 done/faildでコールバックを定義することにより、Ajaxコールが成功または失敗したときにさらに処理できます。コードは次のとおりです(このコードはjQueryバージョン1.8に基づいています):
コードコピーは次のとおりです。
var menuid = $( "ul.nav")。first()。attr( "id");
var request = $ .ajax({
URL:「script.php」、
タイプ:「投稿」、
データ:{id:menuid}、
データタイプ:「HTML」
});
//コールバック処理コールが成功したとき
request.done(function(msg){
$( "#log")。html(msg);
});
//コールバック処理コールが失敗したとき
request.fail(function(jqxhr、textStatus){
alert( "要求が失敗しました:" + textStatus);
});
構成オブジェクト
関数(またはメソッド)のパラメーターにパラメーターが1つだけ、パラメーターがリテラルである場合、このパターンを構成オブジェクトパターンと呼びます。たとえば、次のコード:
コードコピーは次のとおりです。
var conf = {
ユーザー名: "Shichuan"、
最初:「チュアン」、
最後:「shi」
};
AddPerson(Conf);
AddPersonでは、一般的に初期化作業に使用されるConfの価値を自由に使用できます。たとえば、jQueryのajaxsetupはこのように実装されています。
コードコピーは次のとおりです。
//事前に初期値を設定します
$ .ajaxsetup({
url: "/xmlhttp/"、
グローバル:false、
タイプ:「投稿」
});
//次に、もう一度電話します
$ .ajax({data:mydata});
さらに、多くのjQueryプラグインにもこの形式のパラメーター伝送がありますが、送信することもできません。それらが通過しない場合、デフォルト値が使用されます。
戻り機能
関数を返すことは、1つの関数の戻り値が別の関数である場合、または特定の条件に従って新しい関数が柔軟に作成された場合、特定の条件に基づいて柔軟に作成される新しい関数を指します。例コードは次のとおりです。
コードコピーは次のとおりです。
var setup = function(){
console.log(1);
return function(){
console.log(2);
};
};
//セットアップ関数を呼び出します
var my = setup(); //出力1
私の(); //出力2
//または直接呼び出すこともできます
設定()()();
または、閉鎖機能を使用して、セットアップ関数のプライベートカウンター番号を記録し、各コールでカウンターを増やすことができます。コードは次のとおりです。
コードコピーは次のとおりです。
var setup = function(){
var count = 0;
return function(){
return ++ count;
};
};
// 使用法
var next = setup();
次(); //戻る1
次(); //戻る2
次(); // 3を返します
該当する
ここでの部分的なアプリケーションは、実際に着信パラメーターを分離することです。一連の操作には、1つまたは複数のパラメーターが常に同じまたは複数のパラメーターがある場合があります。次に、最初に部分関数を定義してから、この関数を実行できます(実行中に残りの異なるパラメーターが渡されます)。
たとえば、コードは次のとおりです。
コードコピーは次のとおりです。
var partialany =(function(aps){
//この関数は、関数式の独自の実行の結果であり、Partialany変数に割り当てられます
関数func(fn){
var argsorig = aps.call(arguments、1);
return function(){
var args = []、
argspartial = aps.call(引数)、
i = 0;
//変数のすべての元のパラメーターセット、
//パラメーターがpartialany._プレースホルダーの場合、次の関数パラメーターに対応する値を使用します
//それ以外の場合は、元のパラメーターの値を使用します
for(; i <argsorig.length; i ++){
args [i] = argsorig [i] === func._
? argspartial.shift()
:argsorig [i];
}
//追加のパラメーターがある場合は、最後に追加します
return fn.apply(this、args.concat(argspartial));
};
}
//プレースホルダー設定の場合
func._ = {};
funcを返します。
})(array.prototype.slice);
それを使用する方法は次のとおりです。
コードコピーは次のとおりです。
//処理機能を定義します
function hex(r、g、b){
'#' + r + g + bを返します。
}
//部分関数を定義し、ヘックスの最初のパラメーターrを変更されていないパラメーター値ffとして使用します
var redmax = partialany(hex、 'ff'、partialany._、partialany._);
// redmaxの新しい関数の呼び出し方法は次のとおりであり、2つのパラメーターのみが必要です。
console.log(redmax('11 '、' 22 ')); // "#ff1122"
partialany._が長すぎると思われる場合は、代わりに__を使用できます。
コードコピーは次のとおりです。
var __ = partialany._;
var greenmax = partialany(hex、__、 'ff');
console.log(greenmax('33 '、' 44 '));
var bluemax = partialany(hex、__、__、 'ff');
console.log(bluemax('55 '、' 66 '));
var magentamax = partialany(hex、 'ff'、__、 'ff');
console.log(Magentamax('77 '));
これにより、はるかに簡単になります。
カレー
カレーは機能的なプログラミングの特徴であり、複数のパラメーターの処理をチェーンコールと同様に単一パラメーターの処理に変換します。
追加関数の簡単な例を示しましょう。
コードコピーは次のとおりです。
関数add(x、y){
var oldx = x、oldy = y;
if(typeof oldy === "undefined"){// partial
return function(newy){
Oldx + Newyを返します。
}
}
x + yを返します。
}
このように、次のように呼び出す方法はたくさんあります。
コードコピーは次のとおりです。
// テスト
typeof add(5); // "関数"
追加(3)(4); // 7
//これも可能です
var add2000 = add(2000);
Add2000(10); // 2010
次に、より一般的なカレー機能を定義しましょう。
コードコピーは次のとおりです。
//最初のパラメーターは適用される関数であり、2番目のパラメーターは渡されるパラメーターの最小数です。
function curry(func、minargs){
if(minargs == undefined){
Minargs = 1;
}
関数funcwithargsfrozen(fruensargs){
return function(){
//最適化処理、呼び出し時にパラメーターがない場合は、関数自体を返します
var args = array.prototype.slice.call(arguments);
var newargs = fruensargs.concat(args);
if(newargs.length> = minargs){
return func.apply(this、newargs);
} それ以外 {
funcwithargsfrozen(newargs)を返します。
}
};
}
funcwithargsfrozen([]);
}
このようにして、追加の定義など、ビジネス行動を自由に定義できます。
コードコピーは次のとおりです。
var plus = curry(function(){
var result = 0;
for(var i = 0; i <arguments.length; ++ i){
結果 +=引数[i];
}
返品結果;
}、2);
それを使用する方法はリアルで多様です。
コードコピーは次のとおりです。
プラス(3、2)//通常の呼び出し
プラス(3)//適用、関数を返します(戻り値は3+パラメーター値です)
プラス(3)(2)//完全なアプリケーション(5に戻る)
Plus()(3)()(2)//戻る5
さらに、(3、2、4、5)//複数のパラメーターを受信できます
プラス(3)(2、3、5)//同様に
以下は減算の例です
コードコピーは次のとおりです。
var minus = curry(function(x){
var result = x;
for(var i = 1; i <arguments.length; ++ i){
結果 - =引数[i];
}
返品結果;
}、2);
または、パラメーターの順序を交換する場合は、このように定義できます
コードコピーは次のとおりです。
var flip = curry(function(func){
return curry(function(a、b){
return func(b、a);
}、2);
});
要約します
JavaScriptの関数には多くの特別な機能があり、閉鎖と引数のパラメーター特性を使用して、多くの異なる手法を実装できます。次の記事では、初期化に機能を使用する手法を引き続き紹介します。