Blogger Information
Blog 28
fans 0
comment 0
visits 13047
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
不同的数组类型与访问方式和分支的不同类型演示
手机用户1594223549
Original
490 people have browsed it

一.不同的数组类型与访问方式

1.输出结果

2.代码部分

  1. // ! 数组类型
  2. // * 1.一维数组
  3. // 声明: 字面量, [...]
  4. // 索引: [0,1,2,3,..], 从0开始递增的"有序"正整数
  5. // 值: 可以是任何类型
  6. // 索引+值: 数组成员 或 数组元素
  7. const arr = ['樱桃', '苹果', '栗子']
  8. //逐个:索引用 array,单个索引用arr[...]
  9. console.log('array: ',arr[0], arr[1], arr[2])
  10. console.log('------------------')
  11. // * 2.扩展数组
  12. // forEach: 用于迭代遍历数组或对象
  13. // foreach(callback): 参数是一个函数,当函数当参数时,叫"回调"
  14. // arr.forEach(function(item,key,arr){}), 只有第一个参数item是必选
  15. // ? (1) 多维数组
  16. // 成员仍然是一个数组
  17. // item是项目,key是键,arr是数组
  18. const arr1 = [
  19. [1, '平板', 100],
  20. [2, '电脑', 200],
  21. [3, '手机', 400],
  22. ]
  23. // 箭头函数
  24. arr1.forEach(item => console.log(item))
  25. console.log('------------------')
  26. // ? (2) 对象数组
  27. // 成员是一个对象字面量, 前后端分离开发中, 服务器返回JSON
  28. const arr2 = [
  29. {id: 1, name: '平板', price: 1000},
  30. {id: 2, name: '电脑', price: 2000},
  31. {id: 3, name: '手机', price: 3000},
  32. ]
  33. // 箭头函数
  34. arr2.forEach(item => console.log(item))
  35. console.log('------------------')
  36. // ? (3) 类数组
  37. // 不是 class, 类: 类似,像, 类数组->类似一个数组,但不是数组
  38. // 仍然是一个对象, 用对象来模拟一个数组
  39. // dom编程, 浏览器中的对象
  40. // ** 由0开始的递增的正整数的索引/属性
  41. // ** 必须要有 `length`,表示成员数量/数组长度
  42. const arr3 = {
  43. 0: 'admin',
  44. 1: '12345677@163.com',
  45. 2: '18356789765',
  46. length: 3,
  47. }
  48. // 需要讲类数组转化为真正的数组,否则无法暑输出
  49. console.log(Array.from(arr3))
  50. // 箭头函数
  51. Array.from(arr3).forEach(item => console.log(item))
  52. console.log('------------------')
  53. // ? (4) 函数数组
  54. // 数组成员是函数
  55. const arr4 = [() => '成绩及格', () => '成绩良好', () => '成绩优秀']
  56. // arr4.forEach(arr4 => console.log(arr4, typeof arr4))
  57. // 因为arr4是一个删除,要调用 arr4()
  58. arr4.forEach(arr4 => console.log(arr4()))

二.分支的不同类型(注意else)

1.输出结果

2.代码部分

  1. // ! 分支
  2. // 分支:有条件的执行某一段代码
  3. // * 单分支
  4. if (true) {
  5. console.log('success');
  6. }
  7. console.log('-------------')
  8. // * 双分支(简化:三元):true / default
  9. if (!true) {
  10. console.log('success');
  11. } else {
  12. console.log('fail');
  13. }
  14. // 三元简化
  15. let status = false
  16. let result = status ? '成功' : '失败'
  17. console.log(result)
  18. console.log('-------------')
  19. // * 多分支(简化:switch)
  20. // ? switch
  21. grade = 'C'
  22. switch (grade) {
  23. case 'A':
  24. console.log('优秀')
  25. break
  26. // 返回的意思
  27. case 'B':
  28. console.log('良好')
  29. break
  30. case 'C':
  31. console.log('合格')
  32. break
  33. case 'D':
  34. console.log('补考')
  35. break
  36. default:
  37. console.log('非法输入')
  38. }
  39. console.log('-------------')
  40. // 上面是单值,如果是区间判断
  41. let score = 83
  42. // switch(true) 才能进入到代码体
  43. switch (true) {
  44. case score >= 80 && score <= 100:
  45. console.log('优秀')
  46. break
  47. case score >= 70 && score < 80:
  48. console.log('良好')
  49. break
  50. case score >= 60 && score < 70:
  51. console.log('合格')
  52. break
  53. case score > 0 && score < 60:
  54. console.log('补考')
  55. break
  56. default:
  57. console.log('非法输入')
  58. }
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