JavaScript関数定義

JavaScript関数定義

JavaScriptはキーワード関数を使用して関数を定義します。

関数は宣言によって定義することも、式として定義することもできます。

関数宣言

前のチュートリアルで、関数宣言の構文はすでに理解しました:

function functionName(parameters) {
実行されたコード
}

関数は宣言直後に実行されるのではなく、実行されます。必要なときは電話してください。

関数式

JavaScript 関数は式によって定義できます。

関数式は変数に格納できます:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p>函数可以存储在变量中:</p>
<p id="demo"></p>
<script>
var x = function (a, b) {return a * b};
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>

関数式を変数に格納した後、その変数は関数としても使用できます:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p>函数存储在变量后,变量可作为函数使用:</p>
<p id="demo"></p>
<script>
var x = function (a, b) {return a * b};
document.getElementById("demo").innerHTML = x(4, 3);
</script>
</body>
</html>

上記の関数は実際には匿名関数です(関数には名前がありません) )。

関数は変数に格納され、通常は変数名を通じて呼び出されます。

上記の関数は実行文なのでセミコロンで終わります。

Function() コンストラクター

上の例では、関数がキーワード function を通じて定義されていることを学びました。

関数は、組み込みの JavaScript 関数コンストラクター (Function()) を通じて定義することもできます。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p>JavaScrip 内置构造函数。</p>
<p id="demo"></p>
<script>
var myFunction = new Function("a", "b", "return a * b");
document.getElementById("demo").innerHTML = myFunction(4, 3);
</script>
</body>
</html>

関数ホイスティング(巻き上げ)

「ホイスティング(巻き上げ)」については、前回のチュートリアルですでに学習しました。

ホイスティングは、現在のスコープを前面にホイストする JavaScript のデフォルトの動作です。

ホイスティングは変数宣言と関数宣言に適用されます。

したがって、関数は宣言される前に呼び出すことができます:

myFunction(5);
function myFunction(y) {
    return y * y;
}

式を使用して関数を定義する場合、リフティングはできません。

自己呼び出し関数

関数式は「自己呼び出し」できます。

自己呼び出し式は自動的に呼び出されます。

式の後に()が続くと自動的に呼び出されます。

宣言された関数を自分で呼び出すことはできません。

関数はオブジェクトです

JavaScriptでtypeof演算子を使用して関数の型を決定すると、「function」が返されます。

しかし、JavaScript 関数はオブジェクトとしてより正確に記述されます。

JavaScript 関数にはプロパティとメソッドがあります。

arguments.length プロパティは、関数呼び出し中に受け取ったパラメーターの数を返します。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p> arguments.length 属性返回函数接收到参数的个数:</p>
<p id="demo"></p>
<script>
function myFunction(a, b) {
    return arguments.length;
}
document.getElementById("demo").innerHTML = myFunction(4, 3);
</script>
</body>
</html>

この関数は、オブジェクト メソッドと呼ばれるオブジェクトの属性として定義されます。
関数が新しいオブジェクトの作成に使用される場合、その関数はオブジェクトのコンストラクターと呼ばれます。

学び続ける
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <p> toString() 将函数作为一个字符串返回:</p> <p id="demo"></p> <script> function myFunction(a, b) { return a * b; } document.getElementById("demo").innerHTML = myFunction.toString(); </script> </body> </html>