函数参数类型与返回值\模板字面量与模板函数\闭包\纯函数

1. 函数参数类型与返回值方法

    <script>
      //1、标准情况
      //   function product(参数) {
      //     return 返回值;
      //   }
      //   function product(name) {
      //     return name;
      //   }
      //   console.log(product("红酒"));
      //2、形参有默认值情况，如果没对应的实参，则以默认值为准
      //   function product(name = "跑车") {
      //     return name;
      //   }
      //   console.log(product());
      //3、实参过多，形参用...rest,将剩余参数压缩到rest里.
      //   function product(name = "苹果", ...arr) {
      //     return arr;
      //   }
      //   console.log(product("葡萄", "3", "30", "中国"));
      // 4、... 用在函数调用时，功能是展开数组
      let arr = ["苹果", "梨", "香蕉", "火龙果"];
      function product(...arr) {
        return arr;
      }
      //   console.log(product(...arr));
      console.log(product(...["苹果", "梨", "香蕉", "火龙果"]));
      //用箭头函数来简化匿名函数的编写
      //   function product(name = "苹果", ...arr) {
      //     return arr;
      //   }
      //   console.log(product("葡萄", "3", "30", "中国"));
      let product1 = (name = "苹果", ...arr) => arr;
      console.log(product("葡萄", "3", "30", "中国"));
      //5、返回值，默认是单值返回，可以用数组或者对角返回多个值
      let f = () => ["a", "b", "c", "d"];
      console.log(f());
      let f1 = () => ({
        a: 1,
        b: 2,
        get: function () {
          return a + b;
        },
      });
      console.log(f1().get);
      //全局变量
      let name = "Tom";
      let age = 18;
      let user = {
        name: "Tom",
        age: 18,
        getName: function () {
          return this.name;
        },
      };
      console.log(user.name);
      //与对象user处在同一个作用域内，存在同名的变量
      //这时对象内的变量可以图简写
      //对象中的匿名函数也可以简写 删除:function
      let user1 = {
        name,
        age,
        getName() {
          return this.name;
        },
      };
      console.log(user1.name);
      console.log(user1.getName());
      //也可以用箭头函数来改写
      let user2 = {
        name,
        age,
        // 箭头函数,不要用到对象字面量中
        // this:普通函数，调用时确定
        // this:箭头函数，声明时确定
        getName: () => this.name,
        // getName: () => user2.name,
      };
      console.log(user2.name);
      console.log(user2.getName());
    </script>

2. 实例演示模板字面量与模板函数的声明,参数的特点

    <script>
      //模板字面量与模板函数
      // `字符串${变量名/表达式/三元表达式}`;
      let username = "blue";
      console.log(`他的名字叫：${username}`);
      console.log(`1+2=${1 + 2}`);
      age = 30;
      console.log(`${age >= 18 ? `成年` : `未成年`}`);
      //模板函数：使用”模板字面量“做为参数的函数
      //function total(参数1，参数2)
      //参数1：必须是当前模板字面量参数中的字符串字面量组成的数组
      //参数2：第二个参数必须是一个或多个模板字面量中插值列表
      function total(strings, ...arr) {
        console.log(strings.raw);
        console.log(arr);
      }
      let product_name = "电脑";
      let num = 5;
      let price = 5000;
      total`产品名：${product_name},数量：${num},价格：${price}`;
    </script>

3. 实例演示闭包的形成条件与访问方法,并明白纯函数的特点

    <script>
      //实例演示闭包的形成条件与访问方法,并明白纯函数的特点
      //形成闭包的两个条件
      //   1、父子函数
      //   2、子函数中调用父函数的变量
      //   function f2(a) {
      //     function f3(b) {
      //       return a + b;
      //     }
      //     return f3;
      //   }
      //   console.log(f2(10)(20));
      //匿名函数构建闭包
      //   f2 = function (a) {
      //     f3 = function (b) {
      //       return a + b;
      //     };
      //     return f3;
      //   };
      //   console.log(f2(15)(20));
      //箭头函数构建闭包
      //   f2 = a => b => a + b;
      //   console.log(f2(4)(7));
      //当一个函数不会用到自由变量时，这个函数叫纯函数
      function getPrice(price, dis) {
        return price * dis;
      }
      console.log(getPrice(100, dis));
    </script>