JavaScriptの基本
関数
関数
機能コンセプト
函数： 可以封装一段特定功能代码，然后通过函数名调用，实现对该段代码重复使用
機能の役割
实现代码的重复使用。
✔ 对分散代码整合（封装）
✔ 重复使用
関数の作成
方法1：関数の宣言と実行方法
☞函数的声明： function 自定义函数名() { 具体的功能代码 } 注意： 1.由于函数是用来实现某种特定功能代码，所以一般我们设置函数名的时候，以动词开始。 2.函数不能自己执行代码，需要通过函数名调用实现代码的执行 ☞ 调用函数（执行函数） 函数名(); //函数的调用方法2：関数式（リテラル）と実行方法
☞函数的声明： var fn = function () { 具体的功能代码 } fn();//函数的调用場合
1.将比较数字大小封装到一个函数中 <script> function fn() { var num1 = Number(prompt('请输入一个值')); var num2 = Number(prompt('请输入二个值')); if (num1 > num2) { alert('num1大'); } else if (num1 < num2) { alert('num2大'); } else { alert('num1 = num2'); } } fn(); </script> 2.写一个函数，求1-100之间所有数的和 <script> function fn() { var sum = 0; for (var i = 1; i <= 100; i++) { sum += i; } console.log('1-100之间所有数的和为' + sum); } fn(); </script> 3.通过函数方式实现：判断一个数字是基数还是偶数 <script> var fn = function () { var num = Number(prompt('请输入一个值')); if (num % 2 == 0) { alert('偶数'); } else { alert('奇数'); } } fn(); </script> 4.通过函数的方式实现： 在页面中打印一个10行直角三角形 <script> var fn = function () { for (var i = 1; i <= 10; i++) { for (var j = 1; j <= i; j++) { document.write('*'); } document.write("<br>"); } } fn(); </script> 5.格式化日期的封装 yyyy-mm-dd hh:mm:ss <script> function time() { var d = new Date(); var year = d.getFullYear(); var month = d.getMonth() + 1; var dd = d.getDate(); var h = d.getHours(); var m = d.getMinutes(); var s = d.getSeconds(); console.log(year + '-' + month + '-' + dd + ' ' + h + ':' + m + ':' + s); } time(); </script>
関数パラメーター
正式なパラメータ
在定义函数时候,函数名()里面的变量就叫形参. 形参的本质就是一个变量,但是不需要var定义. 语法： function 函数名(形参,形参,形参...) { //形参，就是一个占位符，命名规则和规范和变量一样 //函数体 } 注意： 1.形参可以是任意的一种类型(变量, 数组, 函数) 2.函数中的形参个数可以是0个或者多个 3.如果函数中有多个形参,形参之间使用逗号隔开引数
在调用函数的时候,函数名()里面的值或者变量叫实参 语法： 函数名(数据,数据,数据...); //实参，就是实际的数据 注意： 1.函数有几个形参就要对应几个实参(实参就是给形参赋值的,一一对应赋值) 2.函数中的形参个数可以是0个或者多个 3.如果函数中有多个实参,实参之间使用逗号隔开場合
1.求 n - m 之间的数字之和 <script> function fn(a, b) { var sum = 0; for (var i = a; i <= b; i++) { sum += i; } console.log(sum); } fn(1, 100); </script> 2.求圆的面积 （3.14 * r*r） <script> function fn(r) { var res = 3.14 * r * r; console.log(res); } fn(10); </script> 3.求3个数中的最大值 <script> function fn(num1, num2, num3) { if (num1 > num2 && num1 > num3) { alert('最大值是num1: ' + num1); } else if (num2 > num1 && num2 > num3) { alert('最大值是num2: ' + num2); } else { alert('最大值是num3: ' + num3); } } fn(9, 11, 3); </script> 4. 判断一个数是奇数还是偶数 <script> function fn(a) { if (a % 2 == 0) { alert('偶数'); } else { alert('奇数'); } } fn(19); </script> 5. 求5个数的总和 //函数中可以设置5个参数 <script> function fn(a, b, c, d, e) { var sum = 0; sum = a + b + c + d + e; console.log(sum); } fn(1, 2, 3, 4, 5); </script> //函数中可以设置1个参数,参数可以表示一个数组 <script> function fn(ary) { var sum = 0; for (var i = 0; i < ary.length; i++) { sum += ary[i]; } console.log(sum); } fn([1, 2, 3, 4, 5]); </script>
関数の戻り値
戻り値：関数の実行後、戻り構文を使用して実行結果を呼び出し元に返すことができます。
function add(num1，num2){ //函数体 return num1 + num2; // 注意：return 后的代码不执行 } var resNum = add(21,6); // 调用函数，传入两个实参，并通过resNum接收函数返回值 alert(resNum);// 27 注意： 1.如果函数没有显示的使用return语句那么函数有默认的返回值 undefined 2.如果函数中写了return语句，后面没有写任何其他内容那么函数的返回值依然是 undefined 3.一个函数只能有一个返回值 4.return 代码执行完成后，后面的代码不再执行 5.函数也可以作为返回值（理解）場合
1.获取数组中最大值，并返回 <script> function fn(ary) { var max = ary[0]; for (var i = 1; i < ary.length; i++) { if (max < ary[i]) { max = ary[i]; } } return max; } var max = fn([1, 2, 3]); console.log('最大值是: ' + max); </script> 2.将一个数组中所有偶数添加到一个新数组中返回，并计算新数组总和。 <script> function fn(ary) { var sum = 0; var b = []; for (var i = 0; i < ary.length; i++) { if (ary[i] % 2 == 0) { b[b.length] = ary[i]; } } for (var j = 0; j < b.length; j++) { sum += Number(b[j]); } return [b, sum]; } var he = fn([1, 3, 5, 2, 4, 6]); console.log(he); </script> 3.写一个函数，判断是否是闰年【能被4整除且不能被100整除，或者能被400整除】 <script> function fn(a) { if (a % 4 == 0 && a % 100 != 0 || a % 400 == 0) { a = '闰年'; } else { a = '不是闰年'; } return a; } var b = fn(Number(prompt('请输入一个年份'))); alert(b); </script>
関数の他の部分
引数の使用
☞ arguments 的使用场景:
1.形参数的个数不确定,但是又需要得到实参的信息,那么就需要用 arguments
2.arguments其实就是用来保存函数实参信息的一个伪数组(长得像数组,可以遍历,但是不能使用数组的方法)
3.arguments伪数组中,length代表参数的个数. 如果希望得到具体的参数信息,则需要遍历arguments
☞ 总结：
1.如果函数参数不确定，可以定义函数的时候不写参数，通过arguments获取
2.如果函数的参数确定，那么推荐定义函数的时候写参数
☞ 案例：
<script>
// arguments 数组的最大值做
function getMax() {
var max = arguments[0];
for (var i = 1; i < arguments.length; i++) {
if (max < arguments[i]) {
max = arguments[i];
}
}
return max;
}
var max = getMax(1, 2, 3, 5, 9, 10, 8);
console.log(max);
</script>
匿名関数と自己呼び出し関数
☞ 匿名函数：没有函数名的函数
例如：
var fn = function () {
}
总结：
1.匿名函数不能单独使用
2.可以将匿名函数赋值给一个变量
3.可以让匿名函数自己调用自己（自调用函数【匿名函数】）
☞ 自调用函数： 函数封装好，立即执行，本质上就是函数调用的一种方式
例如：
1.( function () {
} )();
注意:
1.第一个()表示将整个函数作为一个整体
2.第二个()表示对函数的调用
3.自调用函数中依然可以设置参数
関数スコープとローカル変数
範囲
作用域： 变量或者函数可以起作用的区域 ◆ 全局作用域（全局变量） 1.在script标签中或者js文件中定义的变量，在任何地方都可以访问 2.在函数内部声明变量不使用var关键字 （不建议使用） ◆ 局部作用域（局部变量） 1.在函数内部定义的变量 2.局部变量只能在定义变量的函数中使用グローバルスコープ（グローバル変数）
声明在所有函数外部的变量，可以所有地方使用ローカルスコープ（ローカル変数）
声明在某个函数内部的变量或函数的形参，只能在函数内部使用
スコープチェーン
作用域链：
当访问一个变量时，会先从本作用域中去找这个变量，若找不到则向上一级作用域中去找，依次类推，就形成了一个作用域链。
スコープケース
<script>
//全局变量
var a = 123;
//定义一个函数
function fn() {
// 局部变量
var a = 456;
// 局部的函数 fn1();
function fn1() {
var a;
//局部作用域
console.log(a); //123? 456? undefined? 报错?
}
// 调用当前函数
fn1();
}
//调用函数, 执行函数中的代码
fn();
</script>
コードの事前解析
☞ 代码在执行前会进行预解析。
1.变量声明提升，把变量提升到当前作用域的最上面，不包括赋值
2.函数声明提升，把函数提升到当前作用域的最上名，不包括函数的调用
分析前の面接の質問をコーディングする
var a = 25;
function abc () {
alert(a);// undfined
var a = 10;
}
abc();
コード仕様
1.命名规范
变量，函数的命名必须有含义
◆ 变量 的名称一般用名词
◆ 函数 的名称一般用动词
2.变量规范
◆ 操作符 前后 加 空格
3.空格规范
if () {
}
for () {
}
var ary = [1, 2, 3, 4];
function fn () {
}
欠点がある場合
は、継続するようにアドバイスしてください。更新を続けてください。
一緒に進歩しましょう！