笔记来源 尚硅谷最新版JavaScript基础全套教程完整版(140集实战教学,JS从入门到精通)_哔哩哔哩_bilibili

函数

1、函数的简介

函数也是一个对象,可以封装一些功能(代码),在需要时可以执行这些功能(代码),可以保存一些代码在需要的时候调用

使用typeof检查一个函数对象时,会返回function

  1. // 创建一个函数对象
  2. // 可以将要封装的代码以字符串的形式传递给构造函数
  3. var fun = new Function("console.log('Hello World.');");
  4. // 封装到函数中的代码不会立即执行
  5. // 函数中的代码会在函数调用的时候执行
  6. // 调用函数语法:函数对象()
  7. // 当调用函数时,函数中封装的代码会按照顺序执行
  8. fun(); // Hello World.

使用函数声明来创建一个函数

  1. function 函数名([形参1, 形参2...形参N]) {
  2. 语句...
  3. }
  4. // 调用函数
  5. 函数名();

示例

  1. function fun1(){
  2. console.log("Hello world.");
  3. alert("Hello World!");
  4. document.write("Helloworld");
  5. }
  6. fun1();

使用函数表达式(匿名函数)来创建一个函数

  1. var 函数名 = function([形参1, 形参2...形参N]) {
  2. 语句...
  3. };
  4. // 调用函数
  5. 函数名();

示例

  1. var fun1 = function(){
  2. console.log("Hello world.");
  3. alert("Hello World!");
  4. document.write("Helloworld");
  5. };
  6. fun1();

2、函数的参数

定义一个用来求两个数和的函数

可以在函数的()中来指定一个或多个形参(形式参数)多个形参之间使用,隔开,声明形参就相当于在函数内部声明了对应的变量

在调用函数时,可以在()中指定实参(实际参数)

  • 调用函数时解析器不会检查实参的类型。所以要注意,是否有可能会接收到非法的参数,如果有可能则需要对参数进行类型的检查
  • 调用函数时,解析器也不会检查实参的数量,多余实参不会被赋值。如果实参的数量少于形参的数量,则没有对应实参的形参将是undefined
  1. // 创建一个函数,用来计算三个数的和
  2. function sum(a, b, c) {
  3. alert(a + b + c);
  4. }
  5. sum(1, 2, 3, 4); // 6

3、函数的返回值

可以使用return来设置函数的返回值语法:return 值

return后的值将会作为函数的执行结果返回,可以定义一个变量,来接收该结果

在函数中return后的语句都不会执行

如果return语句后不跟任何值,就相当于返回一个undefined;如果函数中不写return,则也会返回undefined

return后可以跟任意类型的值

  1. // 创建一个函数,用来计算三个数的和
  2. function sum(a, b, c) {
  3. // var result = a + b + c;
  4. // return result;
  5. return a + b + c;
  6. }
  7. // 调用函数
  8. // 变量result的值就是函数的执行结果
  9. // 函数返回什么result的值就是什么
  10. var result = sum(1, 2, 3);
  11. console.log("result = " + result);

练习

  1. // 1、定义一个函数,判断一个数字是否是偶数,如果是返回true,否则返回false
  2. function isEven(num){
  3. // if(num % 2 == 0){
  4. // return true;
  5. // }
  6. // return false;
  7. return num % 2 == 0;
  8. }
  9. var result = isEven(6);
  10. console.log(result); // true
  11. result = isEven(7);
  12. console.log(result); // false
  13. // 2、定义一个函数,可以根据半径计算一个圆的面积,并返回计算结果
  14. function calCirc(radius) {
  15. return 3.14 * Math.square(radius);
  16. }
  17. var result = calCirc(2); //

实参可以是任意的数据类型,也可以是一个对象。当我们的参数过多时,可以将参数封装到一个对象

  1. function sayHello(o){
  2. console.log("我是" + o.name
  3. + ",今年我" + o.age
  4. + "岁了,我是一个" + o.gender
  5. + "人,我住在" + o.address);
  6. }
  7. var obj = {
  8. name: "孙悟空",
  9. age: 1000,
  10. gender: "男",
  11. address: "花果山"
  12. };
  13. sayHello(obj); // 我是孙悟空,今年我1000岁了,我是一个男人,我住在花果山

实参可以是一个对象,也可以是一个函数

  1. function calCirc(radius) {
  2. return Math.PI * Math.pow(radius, 2);
  3. }
  4. function fun(a){
  5. console.log("a = " + a);
  6. }
  7. fun(calCirc);
  8. // a = function calCirc(radius) {
  9. // return Math.PI * Math.pow(radius, 2);
  10. // }
  11. fun(calCirc(10)); // a = 314.1592653589793

calCirc(10)

  • 调用函数
  • 相当于使用的函数的返回值

calCirc

  • 函数对象
  • 相当于直接使用函数对象

函数也是一个对象,特殊在其具有功能

break、continue、return对比

  • break可以退出当前的循环
  • continue用于跳过当次循环
  • return可以结束整个函数

在函数内部再声明一个函数

  1. function fun3(){
  2. function fun4(){
  3. console.log("I'm fun4.");
  4. }
  5. fun4();
  6. }
  7. fun3(); // I'm fun4.
  8. function fun5(){
  9. function fun6(){
  10. console.log("I'm fun6.");
  11. }
  12. return fun6;
  13. }
  14. var a = fun5();
  15. a(); // I'm fun6.
  16. fun5()(); // I'm fun6.

4、立即执行函数

函数定义完,立即被调用,这种函数叫做立即执行函数

立即执行函数往往只会执行一次

  1. // 函数对象()
  2. (function(){
  3. console.log("I'm anoymous function.");
  4. })(); // I'm anoymous function.
  5. (function(a, b){
  6. console.log(a + b);
  7. })(2,3); // 5