Blogger Information
Blog 11
fans 0
comment 0
visits 5880
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
js闭包/类创建/解构赋值
becauses
Original
417 people have browsed it

闭包(1.父子函数 2.子函数调用了父函数中的变量)

  1. function f2(){
  2. let a = 1;
  3. return function (){
  4. retrun (a = a + 1);
  5. }
  6. }
  7. const f = f2();
  8. console.log(f());//1
  9. console.log(f());//2
  • 闭包:偏函数
  1. //分批传入参数
  2. fn = function(a){
  3. return function(b){
  4. return function(c){
  5. return a + b + c;
  6. }
  7. }
  8. }
  9. //箭头函数简写
  10. fn = a => b => c => a+b+c;
  11. console.log(fn(1)(2)(3));
  12. //或者
  13. f = fn(1);
  14. f2 = fn(2);
  15. console.log(f2(3));
  • 把闭包:纯函数
  1. let discound = 0.8;
  2. function getPrice(price, discound = 1) {
  3. // 纯函数中禁用有自由变量
  4. return price * discound;
  5. }
  6. console.log(getPrice(12000, discound));

访问器属性

  1. let user = {
  2. data:{name:"nn",email:"email"},
  3. // 访问email [注意空格必须]
  4. get email(){
  5. return user.data.email;
  6. },
  7. // 设置email [注意空格必须]
  8. set email(email){
  9. this.data.email = email;
  10. }
  11. };
  12. user.email = "mm";
  13. console.log(user.email)

类与构造函数

  • js老方法实现
  1. //首字母必须大写
  2. let User = function(name,email,sex){
  3. //私有成员
  4. let gender = sex;
  5. this.name = name;
  6. this.email = email;
  7. }
  8. //调用
  9. const user1 = new User("admin","email","male");
  10. //给User添加方法
  11. User.prototype.getInfo = function(){
  12. retrun `name = ${this.name},email = ${this.email}`;
  13. }
  14. console.log(user1.getInfo);
  15. //静态成员直接挂载到对象上的属性
  16. User.status = "enabled";
  17. console.log(User.status);
  • ES6 class实现
  1. class User1{
  2. //公共字段(可选)
  3. name = 'username';
  4. email = 'email.com';
  5. //私有成员
  6. #gender = 'male';
  7. //构造方法
  8. constructor(name,enmail,sex){
  9. this.name = name;
  10. this.email = email;
  11. this.#gender = sex;
  12. }
  13. //公共方法:原型
  14. getInfo(){
  15. return `name = ${this.name},email = ${this.email}`;
  16. }
  17. //静态成员
  18. static status = "enabled";
  19. }
  20. //调用
  21. const user4 = new User1("name","email","sex");
  22. //继承
  23. class Child extends User1{
  24. constructor(name,email,sex,salary){
  25. //调用父级构造函数
  26. super(name,email,sex);
  27. //子类新属性
  28. this.salary = salary;
  29. }
  30. //重写父类方法
  31. getInfo(){
  32. //调用父类方法
  33. return `${super.getInfo()},salary = ${this.salary}`;
  34. }
  35. }
  36. //调用
  37. const user5 = new User1("name2","email2","sex2","123456");
  38. //在类中使用访问器属性(访问与修改私有成员)
  39. class Stu{
  40. #age = 0;
  41. get age(){
  42. return this.#age;
  43. }
  44. set age(age){
  45. this.age = age;
  46. }
  47. }
  48. //调用
  49. let stu = new Stu();
  50. //设置
  51. stu.age = 100;
  52. //访问
  53. stu.age

解构赋值

  • 数组解构
  1. //age 默认值
  2. let [name,email,age = 10] = ["nn","ee"];
  3. console.log(name,email);
  • 对象解构
  1. //对象模板必须等于对象字面量
  2. let {id,lesson,score} = {id:1,lesson:'js',score:80}
  3. //再次赋值必须加括号包含
  4. ({id,lesson,score}) = {id:2,lesson:'js2',score:22}
  5. //别名(命名冲突时使用)
  6. let {id:userId,lesson:userLesson,score:userScore} = {id:2,lesson:'js2',score:22}
  7. console.log(userId);
  8. //克隆对象
  9. let {...obj} = {id:1,lesson:'js',score:80}
  10. //案例
  11. function getUser({id,name,email}){
  12. //解构传参
  13. console.log(id,name,email);
  14. }
  15. getUser({id:123,name:'name','email'})
Correcting teacher:PHPzPHPz

Correction status:qualified

Teacher's comments:
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!