関数
Js関数の定義:繰り返し実行および呼び出すことができるコードブロックをカプセル化します。
目的:多くのコードを再利用できるようにする
機能体験
関数の合計
関数名の命名は動詞であり、変数名の命名は名詞です
<script>
function getSum(num1, num2) {
var sum = 0;
for (var i = num1; i <= num2; i++) {
sum = sum + i;
}
return sum;
}
console.log(getSum(1, 100)); //求~100的和
console.log(getSum(1, 1000)); //求1~1000的和
</script>
関数の使用
- 宣言機能
- 関数を呼び出す
宣言機能
function 函数名() {
//函数体
}
関数を呼び出す
函数名()
予防
- functionは関数を宣言するためのキーワードであるため、小文字にする必要があります
- 関数は何かをすることなので、関数の名前は動詞です
- 関数自体は実行されません。実行するには呼び出す必要があります
- 電話をかけるときは括弧を追加することを忘れないでください
関数の簡単な使用
<script>
//声明函数
function sayHi() {
return '尧子陌'
}
//调用函数
console.log(sayHi())
</script>
関数のカプセル化
簡単に言えば、1つの関数と複数の関数を関数の形でカプセル化し、外部への単純な関数インターフェースを提供することです。
簡単な理解:エクスプレスパッケージに似ています
関数のカプセル化により、1〜10の累積乗算が検出されます
<script>
function getSum(num1, num2) {
var sum = 1;
for (var i = num1; i <= num2; i++) {
sum = sum *i;
}
return sum;
}
console.log(getSum(1, 10)); //求~10的相乘的结果
</script>
関数パラメーター
- 関数パラメーター:仮パラメーター
- 関数を宣言するとき、関数名の後の括弧内のパラメーターは仮パラメーターと呼ばれます。仮パラメーターは仮パラメーターであり、実際のパラメーターによって渡された値を受け取るために使用されます。
- 関数を呼び出す場合、関数名の後の括弧内のパラメーターは実際のパラメーターと呼ばれます。
- 関数内の値は不確実であり、実際のパラメーターを介してさまざまな値を渡すことができます
- 関数のパラメーターはオプションです
ファンクションケース
関数ケースの任意の2つの数値の合計
<script>
// 声明函数
function getSum(num1, num2) {
return num1 + num2
}
//调用函数
console.log(getSum(100, 200))
console.log(getSum(10, 20))
</script>
任意の2つの数値の合計を求める関数ケース
<script>
//声明函数
function getSum(star, end) {
var sum = 0;
for (var i = star; i <= end; i++) {
sum = sum + i;
}
return sum
}
//调用函数
console.log(getSum(20, 50))
console.log(getSum(1, 100))
</script>
関数の形状は、引数の数のマッチングに関与します
関数の正式な参加数と実際のパラメーターが同じ場合
関数パラメーターの数が同じ場合、入力結果は正常です
<script>
//声明函数
function getSum(num1, num2) {
return num1 + num2
}
//调用函数
console.log(getSum(10, 20))
</script>
関数の実パラメータの数が仮パラメータの数よりも多い場合
関数の仮パラメータの数が実際のパラメータの数より少ない場合は、仮パラメータの数が優先されます。
<script>
//声明函数
function getSum(num1, num2) {
return num1 + num2
}
//调用函数
console.log(getSum(1, 200, 500))
</script>
関数の仮パラメーターが実際のパラメーターよりも大きい場合
関数パラメーターの数が実際のパラメーターの数よりも多い場合、結果はNaNになります
予防
- 関数の正式なパラメーターは未割り当ての変数と見なすことができ、値は未定義です。
- undefinedに任意の値を追加すると、最終結果はNaN(数値ではありません)になります
<script>
//声明函数
function getSum(num1, num2, num3) {
return num1 + num2 + num3
}
//调用函数
console.log(getSum(100, 200)) //形参的个数大于实参的个数的情况下
console.log(getSum(100, 200, 500)) //形参的个数与实参的个数一致的情况下
</script>
関数パラメーターの要約
- 関数はパラメーターを受け取ることも、パラメーターを受け取らないこともできます
- 関数に複数のパラメーターがあり、英語でコンマで区切られている場合
- 関数を宣言する場合、関数の後の括弧内のパラメーターは仮パラメーターであり、デフォルト値は未定義です。
- 関数を呼び出す場合、関数の後の括弧内のパラメーターは実際のパラメーターです。
- パラメータの形式と実際のパラメータは一貫している必要があります。そうしないと、結果を予測するのが困難になります。
関数の戻り値
関数は、特定のことまたは特定の関数を実現し、最終的に関数の呼び出し元に戻り値を返すことです。
関数の実行中にreturnが発生すると、結果は関数の呼び出し元に返されます。
<script>
//声明函数
function getResult() {
return 520
}
//调用函数
console.log(getResult())
</script>
関数の戻り値は、2つの数値の間の最大値を見つけます
最初のタイプ:ifステートメントを使用します
<script>
function comParison(num1, num2) {
if (num1 > num2) {
return num1
} else {
return num2
}
}
console.log(comParison(20, 50))
</script>
2番目のタイプ:3項式を使用する
<script>
function comParison(num1, num2) {
return num1 > num2 ? num1 : num2
}
console.log(comParison(20, 50))
</script>
関数の戻り値は、配列の最大値を見つけます
実際の開発では、変数は通常、関数の戻り値を受け取るために使用されます
<script>
function getMax(arr) {
var max = arr[0]
for (var i = 0; i < arr.length; i++) {
if (max <= arr[i]) {
max = arr[i]
}
}
return max;
}
var result = getMax([5, 10, 52, 38, 98,69]);
console.log(result);
</script>
戻る
戻り値:終了関数
返品後のステートメントは実行されません
<script>
function getSum(num1, num2) {
return num1 + num2;
alert('hello word')
}
getSum(10, 20);
console.log(getSum(10, 20));
</script>
返却後に返却できる値は1つのみです
<script>
function fn(num1, num2) {
return num1, num2
}
console.log(fn(20, 50));
</script>
戻り配列を使用すると、複数の値を返すことができます
<script>
function fn(num1, num2) {
return [num1 * num2, num1 / num2, num1 - num2, num1 + num2]
}
console.log(fn(20, 50));
</script>
ブレークコンティニューリターンの違い
- ブレーク:現在のループを終了します
- 続行:現在のループを終了し、次のループに進みます
- return:入力しない場合は、ループから飛び出して関数本体のコードを終了し、結果を関数の呼び出し元に返すことができます。
ジューサーを通して機能を通して見る
引数の使用
実際のパラメーターがいくつあるかわからない場合は、関数の組み込みオブジェクトであり、渡されたすべての実際のパラメーターを格納するargumentsオブジェクトを使用できます。
<script>
function fn() {
for (var i = 0; i < arguments.length; i++) {
console.log(arguments[i]);
}
}
fn(5, 20, true, false, '李小龙', '张飞');
</script>
予防
- 引数は疑似配列であり、本当の意味での配列ではありません
- 引数には長さ属性があり、インデックスでソートされます
- 引数は、push、popなどの実際の配列メソッドを使用できません
引数を使用して、配列の最大値を見つけます
アイデア:配列の最大値を見つけるというアイデアは同じです
<script>
function fn() {
//声明一个最大值变量max
var max = 0;
for (var i = 0; i < arguments.length; i++) {
if (max < arguments[i]) {
max = arguments[i]
}
}
return max
}
var result = fn(2, 5, 15, 20, 25, 85, 55, 64);
console.log(result);
</script>
機能包装ケース
関数パッケージの場合に任意の配列を反転します
<script>
function reserve(arr) {
var newArray = [];
for (var i = arr.length - 1; i >= 0; i--) {
newArray[newArray.length] = arr[i]
}
return newArray;
};
console.log(reserve([20, 50, 60, 80, 100]));
</script>
バブルソートを実現するための関数のカプセル化
<script>
function fn(arr) {
for (var i = 0; i <= arr.length - 1; i++) { //外层负责趟数
for (var j = 0; j <= arr.length - i - 1; j++) { //内层负责每次交换的次数
if (arr[j] > arr[j + 1]) {
var temp = arr[j]
arr[j] = arr[j + 1]
arr[j + 1] = temp
}
}
}
return arr
}
console.log(fn([20, 80, 15, 2, 69, 35]));
</script>
関数のカプセル化を使用して、うるう年と通常の年を決定します
ロックを宣言します。うるう年の場合はtrueを返し、うるう年でない場合はfalseを返します。
<script>
function isRunYear(year) {
var flag = false;
if (year % 4 == 0 && year % 400 != 0 || year % 400 == 0) {
flag = true;
}
return flag
}
console.log(isRunYear(2000))
console.log(isRunYear(2001))
</script>
関数間の相互呼び出し
各コードは特別なコードブロックであり、特別なタスクを完了するために、関数は相互に呼び出すことができます
<script>
function fn1() {
console.log(111);
fn2()
}
fn1();
function fn2() {
console.log(222);
}
</script>
関数の相互呼び出しの場合
<script>
function fn1() {
console.log(111);
fn2();
console.log('fn1')
}
function fn2() {
console.log(222);
console.log('fn2')
}
fn1()
</script>
関数間で呼び出す2月の日数
feBruary関数では、isRunYear関数がif判定ステートメントで呼び出され、渡されます。trueの場合は2月に29日、falseの場合は2月に28日となります。
<script>
function feBruary() {
var year = prompt("请输入当前的年份")
if(isRunYear(year)) {
alert('当前是闰年 2月份有29天')
}else {
alert('当前是平年 2月份有28天')
}
}
feBruary() //调用函数
function isRunYear(year) {
var flag = false;
if(year % 4 ==0 && year % 400 != 0 || year % 400 == 0) {
flag = true;
}
return flag
}
</script>
関数を宣言する2つの方法
関数キーワード宣言
<script>
function fn(str) {
console.log(str);
}
fn('hello')
</script>
関数式宣言関数
<script>
var fn = function(str) {
console.log(str)
}
fn('hello word')
</script>
注意
- fnは変数名であり、関数名ではありません
- 関数を宣言する方法は、一方が変数を格納し、もう一方が関数を格納することを除いて、変数の宣言と似ています。
- 関数式はパラメーターを渡すこともできます。