ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript学習メモ(4)関数関数編_基礎知識

JavaScript学習メモ(4)関数関数編_基礎知識

WBOY
WBOYオリジナル
2016-05-16 16:34:541062ブラウズ

関数は、呼び出されたときに実行されるイベント駆動型または再利用可能なコードのブロックです。
Jscript は 2 種類の関数をサポートしています。1 つは言語の内部関数 (eval() など)、もう 1 つは自分で作成した関数です。

JavaScript 関数内で宣言された変数 (var を使用) はローカル変数であるため、関数内でのみアクセスできます。 (この変数のスコープはローカルです)。

変数が宣言されている関数のみがその変数を認識するため、異なる関数で同じ名前のローカル変数を使用できます。

関数の呼び出し方法

1. 通常の呼び出し: functionName (実際のパラメータ...)

2. 関数を指す変数を介して呼び出します:

var myVar = 関数名;

myVar(実際のパラメータ...);

関数を返す関数

1.関数が明確な戻り値を持たない場合、戻り値は「未定義」になります。

2. 関数に戻り値がある場合、戻り値が何であっても返されます。

return ステートメントを使用すると、関数を呼び出した場所に戻すことができます。

return ステートメントを使用すると、関数は実行を停止し、指定された値を返します。

関数は通常、一意の値を返すため、この値は別の関数である可能性もあります:

コードをコピーします コードは次のとおりです:

<スクリプトタイプ="text/javascript">
var box = function(){
var a=1;
return function(){
アラート(a)
}
}
alert(box());//「function(){alert(a )}」をポップアップします

ここでは、戻り値を変数に代入し、通常の関数のように呼び出します。

コードをコピーします コードは次のとおりです:

<スクリプトタイプ="text/javascript">
var box = function(){
var a=1;
return function(){
アラート(a)
}
}
var newFunc = box();
newFunc();//2

返された関数をすぐに実行したい場合は、box()() を使用してこのコードを実行することもできます。

すべての ECMAScript 関数のパラメーターは値によって渡されます。これは、パラメーターが参照によって渡されないことを意味します。

追記: 参照渡しがある場合、関数内の変数はグローバル変数となり、外部からアクセスすることもできます。

(1) 値の型: 数値、ブール値、null、未定義。
(2) 参照型: オブジェクト、配列、関数。

参照型値: ヒープ メモリに保存されているオブジェクトを指します。つまり、変数に保存されているものは実際には単なるポインタであり、オブジェクトはメモリ内の別の場所に保存されます。 🎜 > 匿名関数を作成します

コードをコピーします コードは次のとおりです:
function(){
return 'Lee'; //別の匿名関数は実行できても名前がないため呼び出すことができません
}

この種の匿名関数は、JQuery で多くの用途に使用されます。匿名関数を直接宣言し、すぐに使用します。匿名関数を使用する利点は、一度使用した関数を定義する必要がなく、名前の競合の問題も回避できることです。js には名前空間の概念がないため、名前空間の概念がありません。関数名は競合しやすいため、名前が競合した場合は、最後に宣言されたものが優先されます。

自己実行による匿名関数の実行:

コードをコピーします コードは次のとおりです:
//無名関数を自己実行で実行


匿名関数の自己実行の戻り値を変数に代入します:

コードをコピーします コードは次のとおりです:

//匿名関数の自己実行の戻り値を変数 に代入します



自己実行匿名関数にパラメータを渡す:

コードをコピーします コードは次のとおりです:
//自己実行匿名関数のパラメータを渡します



JavaScript は動的関数を作成します:

JavaScript は動的関数の作成をサポートしています。動的関数は Function オブジェクトを使用して定義する必要があります (Function は JavaScript のオブジェクトであり、固定です。Function オブジェクトの「F」は大文字にする必要があると規定されています)。 function、関数を定義するときに使用されるキーワードです: function funName(x, y)。これが Function の場合 (F が大文字の場合)、JavaScript のオブジェクトであることがわかります)

動的関数を作成するための基本的な形式: var 変数名 = new Function("パラメーター 1", "パラメーター 2", "パラメーター n", "実行ステートメント");

次のコード部分を見てください:


コードをコピーします コードは次のとおりです:
<スクリプトタイプ="text/javascript">
var square = new Function ("x","y","var sum ; sum = x y;return sum;");
alert("square(2,3) の結果は次のとおりです: " square(2,3)) //square(2,3) の結果は次のとおりです: 5



square は動的に作成される関数です。Function オブジェクトの後の括弧内の内容の各部分は文字列形式でなければなりません。つまり、引用符 ("" または '') で囲む必要があります。

このコード:

var square = new Function ("x","y","var sum ; sum = x y;return sum;");

そして次のコード:


コードをコピーします コードは次のとおりです:
関数 square (x,y){
var sum;
合計 = x y;
合計を返します;
}


は、一方が動的関数であり、もう一方が静的関数であることを除いて、まったく同じです。 なぜコードを小さなコードに分割する必要があるのでしょうか? 、文字列をいくつかの独立した文字列に分割する利点は、文字列の一部を変更することで、いつでも関数の機能を変更できることです。


コールバック関数

コールバックは関数の呼び出しプロセスです。それでは、この呼び出しプロセスを理解することから始めましょう。関数 a には関数 b という 1 つのパラメータがあります。関数 a が実行されると、関数 b も実行されます。そして、このプロセスはコールバックと呼ばれます。

実際、中国語もわかりやすいです。コールバック、コールバックは、電話をかけ直すという意味です。関数 a を先に終了し、後で関数 b を呼び出します。

ここで明確にしなければならないことが 1 つあります。関数 b はパラメーターの形式で関数 a に渡され、関数 b はコールバック関数と呼ばれます。

jquery のエフェクト関数のほとんどにはコールバック関数が含まれます。 jqueryエフェクト関数

例:


コードをコピー コードは次のとおりです:

<スクリプトタイプ="text/javascript">
$("div").show(1000,function(){
//コールバック関数
});

ここでのコールバック関数は、次の例に置き換えることができます:

コードをコピーします コードは次のとおりです:

<スクリプトタイプ="text/javascript">
$("div").show(1000,function(){
console.log("hello world")
});

コールバックとは、実際には、関数が実行された後、現在実行されている関数がいわゆるコールバック関数であることを意味します。どうでしょうか?わかりやすいですね…

メソッドと関数の違い

コードをコピーします コードは次のとおりです:

var arr = [1,2,3,4,5]
var a =12; // 変数: 無料
arr.a= 5; //属性: オブジェクトに属します
function show() //関数: 無料
{
アラート('a');
}
arr.fn = function() //メソッド: オブジェクトに属します
{
アラート('b');
}

実際、メソッドは関数ですが、メソッドはそれが属するオブジェクトです。

ご存知のとおり、関数をクリック イベントにバインドする
構文:

$(セレクター).click(関数)
パラメータの説明
関数はオプションです。クリックイベントが発生したときに実行する関数を指定します。
この形式は jQuery でよく見られます。 function をメソッドのパラメータとして使用し、メソッドにイベント処理関数を追加します。

js グローバル関数

グローバル関数は、組み込みオブジェクトのプロパティやメソッドと同じ概念ではありません。グローバル関数は、どの組み込みオブジェクトにも属しません。
JavaScript には次の 7 つのグローバル関数が含まれており、これらはいくつかの一般的な関数を完了するために使用されます:

escape( )、eval( )、isFinite( )、isNaN( )、parseFloat( )、
parseInt( )、unescape( )。
関数のいくつかの関数

クラスコンストラクターとして使用されます

コードをコピーします コードは次のとおりです:

関数クラス(){}
class.prototype={};
var item=新しいクラス();
クロージャとして使用します

コードをコピーします コードは次のとおりです:
(関数(){
//独立したスコープ
})();

コンストラクターとして呼び出す

いわゆるコンストラクター関数は、この関数を通じて新しいオブジェクトを生成することです。

コードをコピーします コードは次のとおりです:
<スクリプトタイプ="text/javascript"> 関数 test(){
This.x = 10;
}

var obj = new test(); アラート(obj.x) //ポップアップ 10;




オブジェクトは、Object()、Date()、Function() などの定義済みコンストラクターと組み合わせて new 演算子を使用して作成および初期化できます。オブジェクト指向プログラミングの強力な機能は、スクリプトで使用するカスタム オブジェクトを作成するカスタム コンストラクターを定義できることです。定義されたプロパティを持つオブジェクトを作成できるようにカスタム コンストラクターを作成しました。以下はカスタム関数の例です (this キーワードの使用に注意してください)。

コードをコピーします コードは次のとおりです: 関数 Circle (xPoint、yPoint、radius) {
This.x = xPoint; // 円の中心の x 座標。
This.y = yPoint; // 円の中心の y 座標。
This.r = radius; // 円の半径。
}

Circle コンストラクターを呼び出すときは、円の中心点と半径の値を指定します (一意の円オブジェクトを完全に定義するには、これらすべての要素が必要です)。結局のところ、Circle オブジェクトには 3 つのプロパティが含まれています。 Circle オブジェクトをインスタンス化する方法は次のとおりです。

var aCircle = 新しいCircle(5, 11, 99);
コンストラクター関数を使用する利点は、オブジェクトの作成時にいくつかのパラメーターを受け取ることができることです。

コードをコピーします コードは次のとおりです:

<スクリプトタイプ="text/javascript">
関数テスト(名前){
This.occupation = "コーダー";
This.name = 名前;
This.whoAreYou = function(){
return "私は " this.name " であり、 " this.occupation;
です }
}
var obj = new Test('trigkit4');//同じコンストラクターを使用して異なるオブジェクトを作成します
var obj2 = new Test('student');

obj.whoAreYou();//「私は trigkit4 でコーダーです」
Obj2.whoAreYou();//「私は学生でコーダーです」


慣例により、コンストラクター関数の最初の文字を大文字にして、通常の関数と区別する必要があります。

次の 2 つの形式の関数定義は同等です。

コードをコピーします コードは次のとおりです:

<スクリプトタイプ="text/javascript">
var test = function(){
alert("Hello World");
}
alert(typeof(test));//出力関数

変数テストはここで明確に定義されており、その初期値は関数エンティティに割り当てられます

コードをコピーします コードは次のとおりです:

<スクリプトタイプ="text/javascript">
関数テスト(){
alert("Hello World");
}
alert(typeof(test));//出力関数

次の定義された関数形式を見てください:

コードをコピーします コードは次のとおりです:

<スクリプトタイプ="text/javascript">
関数 test(){
alert("Hello World");
};
test();//実際に出力すると こんにちは、不思議ですよね?

関数 test(){
alert("こんにちは");
};
test();//Hello
は正常に出力されます

明らかに、最初の機能は機能しませんでした。奇妙ですよね。 JavaScript 解析エンジンはコードを 1 行ずつ実行するのではなく、コードをセクションごとに実行することがわかっています。同じプログラムの解析と実行では、定義された関数ステートメントが最初に実行されるため、最初の定義のコード ロジックは 2 番目の定義によって上書きされ、同じ関数が 2 回呼び出された場合、2 番目の関数のみが実行されます。実行されました。

値としての関数

関数は js の構文であるだけでなく、値でもあります。つまり、関数を変数に代入したり、オブジェクトのプロパティまたは配列の要素に保存したり、パラメーターとして別の関数に渡すことができます。
関数の名前は実際には目に見えません。関数オブジェクト

を参照する単なる変数の名前です。

コードをコピー コードは次のとおりです:

<スクリプトタイプ="text/javascript">
関数 square(x,y){
return x*y;
}
var s = square; //s と square は同じ関数を参照します
square(2,3);//6
s(2,4);//8

関数を変数に割り当てるだけでなく、関数をオブジェクトの属性として呼び出すこともできます。その関数はメソッドと呼ばれます。

コードをコピーします コードは次のとおりです:

<スクリプトタイプ="text/javascript">
var obj = {square:function(x,y){ //オブジェクトの直接量
return x*y;
}};
var ect = obj.square(2,3);

プロトタイプ属性

各関数には、オブジェクトへの参照を指すプロトタイプ属性が含まれています。このオブジェクトはプロトタイプ オブジェクトと呼ばれます。
詳しくは、JavaScript学習記(5) プロトタイプとプロトタイプチェーン

をご覧ください。

高階関数

ここでいう高階関数とは、高等数学の高階関数ではありません。いわゆる高階関数とは、1 つ以上の関数をパラメータとして受け取り、新しい関数を返す関数のことです。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。