博主信息
博文 26
粉丝 0
评论 1
访问量 16932
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
1. 实例演示class类与extends,super等的用法 2. 实例演示字符串,数组常用API
P粉751989631
原创
568人浏览过
  1. 实例演示class类与extends,super等的用法
  2. 类声明

    1. let User = class {
    2. 构造函数:声明属性
    3. constructor(uname, email) {
    4. (1) 属性
    5. this.uname = uname
    6. this.email = email
    7. }
    8. (2) 方法
    9. say() {
    10. return `${this.uname}: ( ${this.email} )`
    11. }
    12. (3) 静态成员
    13. static nation = 'CHINA'
    14. }
  3. 类的实例化

  1. const user = new User('王小二', 'wang@qq.com')
  2. console.log(user.say())
  3. console.log(User.nation)
  4. 继承
  5. class Child extends User {
  6. constructor(uname, email, sex) {
  7. // super 调用父类成员
  8. super(uname, email)
  9. // 子类扩展的属性
  10. this.sex = sex
  11. }
  12. say() {
  13. // super.say() 父类中的say()
  14. return `${super.say()}, (${this.sex})`
  15. }
  16. }
  17. const child = new Child('仙女', 'xn@qq.com', '女')
  18. console.log(child.say())
  19. ! 在类中使用"访问器属性"
  20. const Stu = class {
  21. #age = 18
  22. get age() {
  23. return this.#age
  24. }
  25. set age(age) {
  26. if (age >= 18 && age <= 100) {
  27. this.#age = age
  28. } else {
  29. console.log('年龄必须在18-100之间')
  30. }
  31. }
  32. }
  33. let stu = new Stu()
  34. console.log('age = ', stu.age)
  35. // stu.age = 120
  36. stu.age = 30
  37. console.log('age = ', stu.age)

运行结果

  1. 实例演示字符串,数组常用API
    数组 API -1
    包括对象在内, 尽量只用字面量来声明

    1. let arr = [1, 2, 'a', 'b', true, { x: 1, y: 2 }, [1, 2, 3], function () {}]
    2. console.log(arr)

    …rest 压缩与展开

    1. arr = [1, 2, 3]
    2. let arr1 = [...arr]
    3. console.log(arr1)
    4. arr = [...arr, 4, 5, 6]
    5. console.log(arr)
    6. console.log('--------------------')

    Array.of 打包

    1. let items = [1, 2, 3, 4, 5, 6]
    2. console.log(Array.of(...items))

    Array.from(): 类数组(对象) -> 包装成一个真正的数组

    1. const likeArr = {
    2. 0: 'red',
    3. 1: 'blue',
    4. 2: 'green',
    5. length: 3,
    6. }

    为什么要转为真数组?
    因为数组上有非常多的方法可以使用

  1. const data = Array.from(likeArr)
  2. console.log(Array.isArray(data) ? 'Array' : 'No Array')
  3. for (let item of data) {
  4. console.log(item)
  5. }

运行结果

批改老师: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+教程免费学