Blogger Information
Blog 26
fans 0
comment 1
visits 10545
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
1. 实例演示对象与数组的解构赋值 2. 实例演示访问器属性,并描述与普通属性之间的区别与联系
P粉751989631
Original
355 people have browsed it
  1. 实例演示对象与数组的解构赋值
    解构语法
    模板 = 集合(数组,对象)

  2. 数组

  1. let [uname, email] = ['杨过', '123@qq.com']
  2. console.log(uname, email)
  3. 更新
  4. [],{},()之前的分号不能省略
  5. ;[uname, email] = ['小龙女', '1456@qq.com']
  6. console.log(uname, email)
  7. 1. 值数量 < 变量数量, 默认值
  8. ;[uname, email, gender = '女'] = ['潘金莲', '789@qq.com']
  9. console.log(uname, email, gender)
  10. 2. 值数量 > 变量数量, ...rest
  11. ;[uname, ...arr] = ['潘金莲', '789@qq.com', '女']
  12. console.log(uname, arr)
  13. console.log(uname, ...arr)
  14. 应用场景: 交接二个数
  15. let x = 10
  16. let y = 20
  17. console.log(`x = ${x}, y = ${y}`)
  18. ;[y, x] = [x, y]
  19. console.log(`x = ${x}, y = ${y}`)
  1. 对象解构
  1. 变量名 === 属性名
  2. let { num, price } = { num: 2, price: 5000 }
  3. console.log(num, price)
  4. [],{},()之前分号不能省略
  5. {}不能出现在等号左边(左值),所以加上括号()转成表达式
  6. ;({ num, price } = { num: 5, price: 6000 })
  7. console.log(num, price)
  8. 命名冲突: 别名
  9. let { pname, price: uniPrice } = { pname: '手机', price: 8000 }
  10. 访问用别名
  11. console.log(pname, uniPrice)
  12. 应用场景1: 克隆对象
  13. let lesson = { name: 'ES6', score: 88 }
  14. console.log(lesson)
  15. 如果想创建二个不相关的对象,值又完全一样,只能克隆
  16. let { ...obj } = lesson
  17. console.log(obj)
  18. console.log(obj === lesson)
  19. 应用场景2 : 解构传参
  20. let show = function (user) {
  21. user 是一个对象
  22. return `${user.uname}: ( ${user.email} )`}
  23. let user = { uname: '朱老师', email: '498668472@qq.com' }
  24. console.log(show(user))
  25. 使用对象解构进行简化传参
  26. show = function ({ uname, email })
  27. {return `${uname}: ( ${email} )`}
  28. user = { uname: '钟老师', email: '45678@qq.com' }
  29. console.log(show(user))
  1. 实例演示访问器属性,并描述与普通属性之间的区别与联系
  1. let course = {
  2. lesson: {
  3. name: 'ET7',
  4. score: 60,
  5. },
  6. getScore() {
  7. return {
  8. name: this.lesson.name,
  9. course: this.lesson.score,
  10. }
  11. },
  12. setScore(score) {
  13. if (score >= 0 && score <= 100) {
  14. this.lesson.score = score
  15. } else {
  16. console.log('成绩必须在1-100分之间')
  17. }
  18. },
  19. }
  20. console.log(course.lesson.score)
  21. console.log(course.getScore())
  22. course.setScore(69)
  23. console.log(course.getScore())

运行结果

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