博主信息
博文 26
粉丝 0
评论 1
访问量 16931
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
1. 实例演示对象与数组的解构赋值 2. 实例演示访问器属性,并描述与普通属性之间的区别与联系
P粉751989631
原创
504人浏览过
  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())

运行结果

批改老师:PHPzPHPz

批改状态:合格

老师批语:完成的不错, 继续加油
本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学