批改状态:合格
老师批语:闭包的本质, 是函数中对外部自由变量的调用规则, 理解了它, 就全通了
// 函数的默认值// 传统方式function func(a, b) {a = a !== undefined ? a : 2;b = b !== undefined ? b : 5;return (a + b);console.log(a);}console.log(func());// ES6function func1(a = 10, b = 20) {return a + b;}console.log(func1());// --------------------------------------------------------------------// 箭头函数// this的指向问题let user = {username: "admin",getuser: function () {// 保存this 以便子函数可以使用this// let thiss = this;setTimeout(function () {// 回调函数的作用域是全局所以this指向是window而不是当前对象// 传统方法 把this保存在一个临时变量中,然后调用console.log("我的名字叫 %s", this.username);}, 1000);},}// 调用对象方法user.getuser.call(user);// 使用箭头函数解决this的指向问题user = {username: "admin123456",getuser: function () {setTimeout(() => {// 箭头函数的this指向是由外围最近一层非箭头函数决定的console.log(this);console.log("我的名字叫 %s", this.username);}, 1000);},}user.getuser();// 箭头函数语法// 1.无参数// 如果函数语句就一行,那么{}可以省略let f1 = () => console.log("箭头函数无参数");f1();// 2.一个参数// 如果只有一个参数那么()可以省略,但不推荐 函数语句就一行那么 return也可以省略let f2 = a => `我是箭头函数中的一个参数(${a})`;console.log(f2(12));// 3.多于一个参数 如果函数语句多于一条时,{}和return不能省略let f3 = (...res) => res.reduce((prev, next) => prev += next, 0);console.log(f3(1, 2, 3, 4, 5, 6, 7, 8, 9, 10));

// 传统对象字面量返回对象=>后面要用()包着{}let stie = (id, name, email) => ({id: id,name: name,email: email,getname: function () {return this.name;},});let newstie = stie("1", "admin", "admin@qq.com");console.dir(newstie);// 如果对象属性名和参数同名,那么可以省略:后面,对象方法可以省略:function// 简化stie = (id, name, email) => ({id,name,email,getname() {return this.name;},});newstie = stie("2", "admin111", "admin111@qq.com");console.dir(newstie);// 动态生成属性名和添加前缀let porp = "stie Name";let obj = "user-";let a = {[porp]: "php.cn",[`${obj}name`]: "admin",[`${obj}email`]: "admin@qq.com",getsite() {return this["stie Name"];},};console.dir(a);

// 闭包的应用场景// 1.访问函数中的私有变量let foo = () => {let username = "admin";// 现在子函数就是闭包,username现在相对于子函数就是自由变量let get = () => username;return get;};let get = foo();console.log(get());let manger = (n) => {let num = n;// 设置let set = (val) => num = val;// 递增let inc = () => num++;// 递减let dec = () => num--;// 打印let print = () => console.log(num);return { set, inc, dec, print };};let get1 = manger(20);console.log(get1);get1.print();get1.inc();get1.inc();get1.print();

// 传统是用构造函数模拟类// 原型属性:prototype,作为构造函数的时候才会用到,使该属性的指针指向新对象的__proto__上// 原型链属性:__proto__,任何一个对象都有这个属性,指向自己的公共属性和方法,函数也是对象所以也有这个属性function Person(name) {// 实例对象的自由属性this.name = name;};// 把公共方法放在函数的原型对象上Person.prototype.sayName = function () {return this.name};// 公共属性Person.prototype.username = "杨果果";let person = new Person("杨过");console.log(person);console.log(person.sayName());let a = new Person("小明");console.log(a);console.log(a.username);// ES6创建类class PersonClass {email = "admin@qq.com";// 构造方法constructor(name) {this.name = name;}// 原型方法sayName() {return this.name;}}person = new PersonClass("小龙女");console.log(person);

1.闭包创建四个api的案列,课件的函数表达式没有用let,var或者const声明,运行函数后就可以直接在外部调用,有点没理解其原理。
2.闭包案列函数表达式我用let声明后返回对象,当做对象方法调用不知道会不会多此一举?
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号