博客列表 >JS学习之变量、函数、数组、对象、作用域及闭包

JS学习之变量、函数、数组、对象、作用域及闭包

centos
centos原创
2021年10月07日 20:00:23403浏览

JS学习之变量、函数、数组、对象、作用域及闭包

变量有数值(number)、字符串(string)、布尔值(boolean)、undefined 、 null
引用类型有:数组array、对象object、函数function三种

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  7. <title>初识js</title>
  8. </head>
  9. <body></body>
  10. <script>
  11. // 变量
  12. let myName = "zhangDeng";
  13. console.log(myName);
  14. // alert
  15. //alert(myName);
  16. let price = 99;
  17. console.log(price);
  18. // 变量有数值(number)、字符串(string)、布尔值(boolean)、undefined 、 null
  19. // 引用类型有:数组array、对象object、函数function三种
  20. // 数组
  21. const price1 = [33, 44, 55, 66];
  22. console.log(price1[0], price1[1]);
  23. // 对象
  24. const shop = {
  25. name: "京东便利店",
  26. room: 150,
  27. price: 8899,
  28. };
  29. console.log(shop.name, shop.price, shop.room);
  30. const shop1 = {
  31. "my name": "京东便利店",
  32. "my-room": 150,
  33. };
  34. console.log(shop1["my name"]);
  35. // 实际开发过程中数组和对象结合使用
  36. const shop2 = [
  37. { name: "饼干", num: 2, price: 3.5 },
  38. { name: "面包", num: 4, price: 4.5 },
  39. { name: "水果", num: 6, price: 7 },
  40. ];
  41. console.log(shop2);
  42. // 函数
  43. function getTotal(name) {
  44. return "hello" + name;
  45. }
  46. console.log(getTotal("张老师"));
  47. // typeof是返回判断变量类型;
  48. console.log(typeof getTotal);
  49. console.log(getTotal.name);
  50. console.log(getTotal.length);
  51. // 数组里包含函数
  52. const arr = [
  53. 123,
  54. "bbb",
  55. [1, 2, 3, 4],
  56. { a: 1, b: 2, c: 3 },
  57. function age() {
  58. console.log("my age is 33");
  59. },
  60. ];
  61. console.log(arr[0]);
  62. console.log(arr[4]());
  63. // 封装函数 对于重复使用的代码,可以考虑封装,实现复用
  64. function sum(num1, num2) {
  65. let total = 0;
  66. total = num1 + num2;
  67. console.log("total=", total);
  68. }
  69. sum(2, 3);
  70. // 胖箭头
  71. // 1.如果执行语句只有一条,可以不写大括号;
  72. // 2.如果参数只有一个,可以不写参数外部的括号;
  73. // 3。如果没有参数,括号必须写
  74. add = () => 11 + 3;
  75. console.log(add());
  76. // 全局变量,函数可以从外向内传递,无法由内向外传递
  77. // 闭包练习 满足两个条件: 父子函数及自由变量
  78. //父函数
  79. function p(n) {
  80. // 子函数
  81. function m() {
  82. return n++;
  83. }
  84. // 返回子函数
  85. return m;
  86. }
  87. // 声明父函数
  88. const r = p(10);
  89. // 返回
  90. r();
  91. console.log(r());
  92. console.log(r());
  93. console.log(r());
  94. console.log(r());
  95. // 经典闭包IIFE;
  96. let jishu = (function (i) {
  97. return function () {
  98. return i++;
  99. };
  100. })(99);
  101. console.log(jishu());
  102. console.log(jishu());
  103. console.log(jishu());
  104. console.log(jishu());
  105. console.log(jishu());
  106. </script>
  107. </html>
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议