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

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

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>初识js</title>
  </head>
  <body></body>
  <script>
    //   变量
    let myName = "zhangDeng";
    console.log(myName);
    // alert
    //alert(myName);
    let price = 99;
    console.log(price);
    // 变量有数值（number）、字符串（string）、布尔值（boolean）、undefined 、 null
    // 引用类型有：数组array、对象object、函数function三种
    // 数组
    const price1 = [33, 44, 55, 66];
    console.log(price1[0], price1[1]);
    // 对象
    const shop = {
      name: "京东便利店",
      room: 150,
      price: 8899,
    };
    console.log(shop.name, shop.price, shop.room);
    const shop1 = {
      "my name": "京东便利店",
      "my-room": 150,
    };
    console.log(shop1["my name"]);
    // 实际开发过程中数组和对象结合使用
    const shop2 = [
      { name: "饼干", num: 2, price: 3.5 },
      { name: "面包", num: 4, price: 4.5 },
      { name: "水果", num: 6, price: 7 },
    ];
    console.log(shop2);
    // 函数
    function getTotal(name) {
      return "hello" + name;
    }
    console.log(getTotal("张老师"));
    // typeof是返回判断变量类型;
    console.log(typeof getTotal);
    console.log(getTotal.name);
    console.log(getTotal.length);
    // 数组里包含函数
    const arr = [
      123,
      "bbb",
      [1, 2, 3, 4],
      { a: 1, b: 2, c: 3 },
      function age() {
        console.log("my age is 33");
      },
    ];
    console.log(arr[0]);
    console.log(arr[4]());
    // 封装函数 对于重复使用的代码，可以考虑封装，实现复用
    function sum(num1, num2) {
      let total = 0;
      total = num1 + num2;
      console.log("total=", total);
    }
    sum(2, 3);
    // 胖箭头
    // 1.如果执行语句只有一条，可以不写大括号；
    // 2.如果参数只有一个，可以不写参数外部的括号；
    // 3。如果没有参数，括号必须写
    add = () => 11 + 3;
    console.log(add());
    // 全局变量，函数可以从外向内传递，无法由内向外传递
    // 闭包练习  满足两个条件： 父子函数及自由变量
    //父函数
    function p(n) {
      // 子函数
      function m() {
        return n++;
      }
      //   返回子函数
      return m;
    }
    // 声明父函数
    const r = p(10);
    // 返回
    r();
    console.log(r());
    console.log(r());
    console.log(r());
    console.log(r());
    // 经典闭包IIFE;
    let jishu = (function (i) {
      return function () {
        return i++;
      };
    })(99);
    console.log(jishu());
    console.log(jishu());
    console.log(jishu());
    console.log(jishu());
    console.log(jishu());
  </script>
</html>

Correcting teacher：

天蓬老师

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

vscode的安装和html语法标签

2022-03-20 10:26:41

Php8, I'm coming too

Learn website layout in 30 minutes

Shangguan Oracle Beginner to Proficient Video Tutorial

Your first line of UNI-APP code

Flutter from scratch to app launch

Brother Lian New Linux Video Tutorial

AXURE 9 Video Tutorial (Suitable for Product Manager Interactive Product Design UI)

Zero Basic Proficiency PS Video Tutorial

16 day UI video tutorial to get you started

PS Techniques and Slicing Techniques Video Tutorial

Alibaba Cloud Environment Construction and Project Launch Video Tutorial

Overview of Computer Networks - Basic Knowledge that Programmers Must Master

Essential Tutorial for Programmers - HTTP Protocol Explanation

Websocket Video Tutorial

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