蒸 馏 器

Javascript笔记

发布于 2023-10-17 18:10 javasScript 

##JavaScript

javascript 的组成

• ECMAscript(核心)
• DOM(documents object model 文档对象模型)
• BOM(brower boject model 浏览器对象模型)

datatype (数据类型)

• 原始数据类型

  • String
  • number
  • boolen
  • null
  • undefined
  • Symbol
  • BigInt

• 复合数据类型

  • object （其中包含 function）
    函数也是对象，对象是包含多个值的变量

一切皆是对象

number

• ` typeof 是操作符不是方法，所以后可以及加()也可以不加 // 用于检测数据类型
• 类型转换：Number() parseIne() parseFloat() （要注意大小写规范）
• NaN isNaN
  NaN 不是一个数字，但是是 number 数字类型，NaN==NaN的值是false
• 快速转换：字符串类型的数字，如果前面放 + 会隐式调用 parseFloat

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

console.log(typeof 123); //number
console.log(typeof 123); //number
console.log(typeof "123"); //string
console.log(typeof "123"); //string
console.log(typeof true); //boolean
console.log(typeof [0, 1, 2, 3, "a", false]); //object
console.log(typeof null); //object  null时一个空指针，是一个对象，所以返回的值为boject
console.log(typeof {}); //object
console.log(typeof function () {}); //function function是一个方法，是可调用对象，所以也是object
console.log(typeof typeof function () {}); //string 主要特别注意的是typeof本身返回的值是string
console.log(typeof NaN); //number  NaN是数字类型
console.log(typeof isNaN); //boolean isNAN是boolean，用于判断对象是否是数字类型

console.log(Number(null)); //0
console.log(Number(undefined)); //NaN

console.log(typeof Number("我爱祖国和人民")); //number number()将其他类型转换为数字类型
// Number()返回的值有两种，一种是数字本身，一种是NaN，都是number数字类型
console.log(Number(132)); //132
console.log(Number("123")); //123
console.log(Number("我爱祖国和人民11")); //NaN

console.log(parseInt("我爱祖国11")); //NaN
console.log(parseInt("132我爱祖国11")); //132 parseInt只对字符串进行从左到右的查找输入匹配的数字，遇到非数字及终止
console.log(typeof parseInt("我爱祖国11")); //number

console.log(typeof +"123");
console.log(typeof []);

变量没有datatype, 只有变量的值才有datatype;
var num = 123;
console.log(typeof num); //number

const name = "jack";
console.log(typeof name); //string

string

• 由 0-16 位 unicode 字符组成；引用时需要使用’’或者””,但不能’、”交叉使用

• .length 属性用于计算字符串长度，不能精确计算字节！

• 转义字符使用\表示

• 类型转换： toString() 、 String() 、eval()

• null 和 undefined 没有 toString 方法，所以转换的时候用String()函数

• 注意.toString()是个合法的方法，而.String()却不是

• 快速转换：如果把某个数据转化为字符串，可以有一个快捷的方式，就是把它与一个字符串 “” 相加就可以了；

• 运算 + - * / % (取余) = 等

• 内置属性

  属性用.表示，方法用 ( ) 表示

  length

  • String length 字符串长度
  • String slice() 字符串切片（）
  • String substring() 字符串子字符串（）
  • String substr() 字符串 substr（）
  • String replace() 字符串替换（）
  • String replaceAll() 字符串替换全部（）
  • String toUpperCase() 字符串到大写（）
  • String toLowerCase() 字符串到小写（）
  • String concat() 字符串 concat（）
  • String trim() 字符串修剪（）
  • String trimStart() 字符串修剪开始（）
  • String trimEnd() 字符串修剪结束（）
  • String padStart() 字符串 padStart（）
  • String padEnd() String padEnd（）
  • String charAt() 字符串字符（）
  • String charCodeAt() 字符串字符代码（）
  • String split() 字符串拆分（）

• String Concatenation(字符串拼接)

  • 使用字符串拼接操作符 + 将变量和字符串连接

    1 2 3

    const name = "Alice"; const age = 25; const message = "My name is " + name + " and I am " + age + " years old.";

• Template Strings (字符串模板)

  • 将变量、表达式插入到字符串的语法（syntanx)为：${……}

    1 2 3 4

    let firstName = "asdf"; let lastName = "wer"; let name = "${firstName} ${lastName}"; let name1 = firstName + " " + lastName

• String 类型

  1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

  var str1 = "123我爱祖国和人民"; var str2 = "123我爱祖国和人民"; var str3 = ""; var str4 = " "; var str5 = "function(){}"; var str6 = 123; var str7 = "123"; // 上面都是合法的string类型 console.log(typeof str1); //string console.log(typeof str2); //string console.log(typeof str3); //string console.log(typeof str4); //string console.log(typeof str5); //string console.log(str5.length); //12 console.log(str4.length); //1 console.log(str6.toString()); //123 console.log(toString(str6)); //bojcet undefinde 这里会抛出一个TypeError，因为toString()是一个方法(method)不能当作函数(function)来调用。 // console.log(str6.String()); //123 console.log(String(str6)); //123 使用String()进行类型转换时，String()是一个函数(function)，不能当作方法(method)来使用。 当使用String()用来构造一个函数时才能当作方法来使用比如： const srt = new String("hello world") // console.log(str6.String()); 这是个不错误的用法 console.log(typeof str6); //number console.log(typeof (str6 + "")); //string console.log(typeof str7); //string console.log(typeof +str7); //number

boolean

• boolean: true false

  • true:true 本身、任何非空字符串、任何非零数值、对象(object)
  • false:false 本身、空字符串、0、NaN、null、undefined

• ！（取反）与！！（取反再取反）

object

• 对象（object）是一种复合数据结构，用于存储和组织相关数据和功能，对象有方法和属性组成，属性表示对象的特征或状态，方法表示对象的执行或操作。
• 对象有键值对（properties）组成的结合，每个键值对包含一个属性名和对应的值，属性名通常是字符串，但也可以是数字和符号，值可以是任意的数据类型，包含对象、数组、正则、data 等，表示的是一组数据或者功能的集合，本质是个集合
• 对像的属性可以通过点表示法（object.property）或方括号表示法（object[‘property’]）进行访问
• 对象可以动态的添加、修改或者删除属性和方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

const person = {
  name: "Alice",
  age: 25,
  sayHello: function () {
    console.log(
      "Hello, my name is " + this.name + " and I'm " + this.age + " years old."
    );
  },
};

console.log(person.name); // 访问属性，输出 "Alice"
console.log(person["age"]); // 访问属性，输出 25

person.sayHello(); // 调用方法，输出 "Hello, my name is Alice and I'm 25 years old."
person.gender = "Female"; // 添加属性
person.age = 26; // 修改属性
delete person.name; // 删除属性

• null undefined

• Symbol

• BingInt

• 属性（property）和方法(method)的区别

  • 属性
    • 属性和方法都是对象(object)的成员，但它们的作用和使用方式略有不同。
    • 属性（property）是对象的值(特性或状态)，用于存贮或者表示对象的状态。可以通过对象的名称和属性名来访问。对象属性通常用于存储对象的状态或特征。 例如:一个人对象可能有属性名为“姓名”、“年龄”、“性别”等，用于描述这个人的基本信息。
    • 属性（property）具有与之相关的值，可以是任何 JavaScript 数据类型，包括字符串、数字、布尔、对象等。
    • 属性可以通过点表示法（object.property）或者方括号表示法（object[‘property’]）来访问和修改
  • 方法
    • 方法(method)是对象的函数，是对象的行为和操作，用于定义对象的功能，通常是对象的函数成员，用于执行特定的动作或操作。可以在对象上调用。
      例如，一个人对象可能有方法名为“说话”、“走路”、“睡觉”等，用于描述这个人的行为或动作。方法可以访问和修改对象的属性，也可以返回值。
    • 方法(Method)包含一系列的语句和算法，可以接受函数并返回结果。
    • 方法(Method)需要通过对象调用来执行，使用点表示法（object.method()）或者方括号表示法（object[‘method’]），在方法的内部，使用this关键字来引用当前对象，可以访问对象的属性和其他方法。
  • 区别
    • 属性描述对象的特征或状态，而方法描述对象的行为或操作
    • 属性存储值，方法执行操作
    • 属性可以直接访问和修改，而方法需要通过对象调用执行
    • 方法可以修改对象的属性值，但属性不能执行任何操作，只能被读取或赋值。

  1 2 3 4 5 6 7 8

  举例： 假设我们有一辆汽车，它有许多属性和方法： 属性：车牌号、颜色、品牌、型号、车速等。这些属性描述了汽车的状态或特征，它们的值可以被读取和设置，但它们并不会对汽车本身产生任何影响。 方法：加速、刹车、转弯、打开车窗、打开收音机等。这些方法描述了汽车的行为或动作，它们会对汽车本身产生影响，例如加速会使汽车前进，刹车会使汽车停止。 因此，属性和方法的区别在于它们描述了汽车的不同方面：属性描述了汽车的状态或特征，而方法描述了汽车的行为或动作。属性可以被读取和设置，但不会对汽车本身产生任何影响；方法可以对汽车产生影响，例如改变汽车的速度或位置

• 方法(method)和函数(function)的区别

  • 方法(method)

    • 方法和函数都可以被调用，但它们的调用方式略有不同。
    • 方法是一个对象的属性，是对象的行为和操作，定义在对象中，通过对象进行调用。
    • 方法是与对象关联的，可以使用对象内部的数据和其他方法
    • 方法(Method)需要通过对象调用来执行，使用点表示法（object.method()）或者方括号表示法（object[‘method’]），在调用时会自动绑定到对象上，在方法的内部，使用this关键字来引用当前对象，可以访问对象的属性和其他方法。

  • 函数（function）

    • 函数是 JavaScript 中的一等公民，是一段独立的可重复用的代码块，可以在任何地方定义和调用，可以接受参数并返回值。当调用一个函数时，只需要使用函数名和一对圆括号来调用它
    • 函数是独立的，没有与之直接关联的对象
    • 函数的上下文（context）取决于它被调用的方式，可以是全局对象，也可以是调用时所指定的对象
    • 函数的调用通过函数名跟一对括号function( )来完成

    1 2 3 4 5 6 7 8 9 10 11 12 13

    // 方法示例 const obj = { method: function () { // 方法体 }, }; obj.method(); // 调用方法 // 函数示例 function myFunction() { // 函数体 } myFunction(); // 调用函数

  1 2 3 4 5 6 7 8 9 10

  类比： 使用一个人类的身体来类比下方法和函数的区别。 我们的身体有许多不同的器官，例如心脏、肺、胃等。每个器官都有自己独特的功能，可以帮助我们完成不同的任务。 方法就像是身体的器官，它们属于身体的某个部分，并且可以完成该部分的特定任务。例如，心脏可以将血液循环到身体的各个部分，它就像是身体的某个部分的方法，可以完成该部分的特定任务。当我们想要使用身体的某个器官时，需要先找到它所在的部位（对象），然后使用该器官（调用该对象的方法）。 函数就像是身体的整体健康状况，它们是独立的代码块，可以实现特定的功能。例如，锻炼可以提高身体的健康状况，它就像是一个函数，可以实现特定的功能。当我们想要改善身体的健康状况时，可以根据医生或运动教练的建议来进行锻炼（调用该函数），然后根据锻炼计划来进行运动。 因此，方法和函数的区别可以类比为身体的器官和整体健康状况的区别。方法属于身体的某个部分，可以完成该部分的特定任务；函数是独立的代码块，可以实现特定的功能。

• 变量（variable）

  • 变量（varibale）是用于存储和引用数据的命名容器，允许在程序中保存数据，并在需要时对其进行访问和操作/修改。变量是数据值（values）的容器容器（containers）

  • 变量的使用

    • 变量的声明（declaration）

      • 变量在使用之前需要先声明，声明变量意味着创建一个具有指定名称的变量，并为其分配内存空间。
      • var 旧版本的声明方式，在块内声明的 var 变量也会重新声明其对应的块外的变量。

        1 2 3 4 5

        var x = 10; { var x = 2; } console.log(x); // 2

      • const 用於声明定义一个常量的变量，后续不能重新赋值。常用于声明一些不可变的变量，只读变量，比如出生日期 等,不能被重新赋值（unreassign),也具备块作用域（block scope)
      • let 不能被重复声明（redelared)的变量,必须在使用前声明，具有块范围（block scope）,可以被重新赋值（reassign）

    • 变量的命名

      • 组成：
        字母、数字、下划线，不能以数字开头
      • 变量名区分大小写
      • 习惯用发为第二个单词开始大写即驼峰命名法（camelCase），或者单词间用_连接即下划线命名法（snake_case）。
      • 保留关键字不可用做变量名，注意 name 比较特殊，但一般不建议做变量名使用。
      • 选择能够描述变量用途的名称。
      • 使用有意义的单词或单词组合，避免使用缩写、简写、无意义的组合
      • 建议使用名字表示对象，变量名应该反应变量所表示的概念。
      • 避免命名的歧义，避免使用容易混淆的变量名，确保容易被理解。

    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

    let x = 10; { let x = 1; // let x = 2; // Identifier 'x' has already been declared,不能被重新声明 x = 2; // 2 可以被重新赋值（reassign) console.log(x); console.log(y); } console.log(x); // 10 ，注意这里因为作用域不同，块内let x = 1 在块外不起任何作用，所有不会报错重复声明。 console.log(y); //x undefined 。具有块作用域block scope const x = 10; { const x = 1; // const x = 2; // Identifier 'x' has already been declared,不能被重新声明 x = 2; // Assignment to constant variable.const不可以被重新赋值（unreassign) console.log(x); console.log(y); } console.log(x); // 10 ，注意这里因为作用域不同，块内const x = 1 在块外不起任何作用，所有不会报错重复声明。 console.log(y); //x undefined 。具有块作用域block scope

• 函数（funciton）

  • 用于执行特定功能的可重复使用的代码块，用于执行特定的任务或操作，函数将一系列的语句组合在一起，并通过给定的输入（参数）来执行特定的计算或操作，并返回一个结果。
  • 函数可以有任意数量的参数，也可以没有参数，参数可以有默认值，也可以通过参数的位置或名称进行传递。
  • 特点 > 高内聚、低耦合、复用、多态 - 封装性
    函数将一段代码封装在内部，形成一个独立的执行单元，这样可以提高代码的可重复性和模块化 - 参数
    sum// 函数可以接受输入参数，这些参数是函数运行时提供的值。参数可以用于函数内部的计算和操作。 - 返回值
    函数可以返回一个值作为结果，返回值可以用于将函数的计算结果传递给调用者。 - 格式
    function functionName(argument1,argument2,……){ /执行语句/ } - return 语句可以不带任何返回值，这时 return 的返回值时 undefined，一般用于需要提前停止函数又不用返回值的情况 - 在被调用（call / invoke）时才执行。
    函数的调用(call):函数名（）
    `javascript
    function sum(a, b) {
    if (a > b) {
    return (a - b);
    }
    else {
    return (b - a); //函数的返回值只能通过 return 返回，遇到执行 teturn 的代买以后函数就会终止，return 以后的语句不会被执行。一个函数可以有多个 return.
    }
    }
    const mat1 = sum(15, 2); // 函数的调用(call):函数名（）
    const mat2 = sum(2, 15);
    const mat3 = sum; // 调用不带（）的函数返回的时函数本身，而不是返回函数的运算值；
    console.log(mat1, “ “, mat2); //17 // 函数的调用(call):函数名（）
    console.log(mat3); // 返回函数本身
  • 箭头函数 （arrow function）

    1 2 3 4 5 6 7 8 9 10 11

    const sum2 = (a, b) => { if (a > b) { return a - b; } else { return b - a; } }; console.log(sum2(15, 2)); console.log(sum2(2, 14)); console.log(sum2); console.log(sum2());

• 对象 object
  // 属性（properte)和方法（method）的集合，而变量是数据的容器，所以对象也是变量，只是包含了更多的值。

// const car = {
// type: “fiat”, //注意对象的属性用，分割（不是；）
// modle: “x”,
// color: “white” // 对象的最后一个字面量的结尾是不需要 ， 的，如果加了，加的，会被解释成一个额外的属性，其属性名是个空的字符串，属性值是 undefined。
// }; //要特别注意这个；不能省略
// console.log(car.type); //用对象名.属性名来访问属性值。
// console.log(car[‘type’]); // 另一种访问属性值的方法，注意 car[‘type’]和 car[“type”]效果是相同的， string 可以是用””，也可以使用’’

// 对象的三种创建方式：
// 使用 对象字面量 object literal;
// 注意对象的属性赋值用的是：而是不是=
// // 等同于 const person = {name: “Leon”,age: 18,city:”HeNan”};
// const person = {
// name : “Leon”,
// age : 18, //属性值以：赋值，属性间用，分隔
// city : “HeNan” //最后一个属性结尾没有符号
// };

// console.log(person.name); //Leon

// 使用 new Object()创建
// const person = new Object();
// person.name = “Leon”;
// person.age = 18;
// person.city = “HeNan”;
// console.log(person.name); //Leon

// 使用 构造函数 constrator
// function person(name , age , city){
// this.name = “Leon”;
// this.age = 18;
// this.city = “HeNan”;
// };

// const person1 = new person(‘Leon’ , 18 , ‘HeNan’); //使用 new 调用构造函数 person 创建对象，将返回值再赋值给变量 person1;
// console.log(person1.name) //Leon

// 使用 Object.create()
// 首先定义一个原型对象
// const personPrototype = { //定义一个名字为 personPrototype 的原型对象
// sayHi: function(){ //原型对象的一个名为 sayHi 的方法
// console.log(“你好，我的名字是” + this.name);
// }
// };
// const person1 = Object.create(personPrototype); //使用 Objcet.crate()方法创建的对象会继承原型对象的属性和方法。
// person1.name = “Leon”;
// console.log(person1.name); // Leon
// person1.sayHi(); // 你好，我的名字是 Leon

// 访问对象属性名称（key）和值(values)的方法

// const person = {
// name: “Leon”,
// age: 18,
// // x: “d”
// };
// let info = “”;
// for (const key in person) {
// console.log(${key} : ${person[key]}); // 这里使用字符串模板语法也叫模板字面量，用``表示，可以在字符串中插入变量、函数调用等
// //info += ${key} : ${person[key]}+”\n”
// }
// console.log(info);

// const myArrary = Object.keys(person); // 使用 Object.keys()\ Object.values() 将对象 person 转换为数组
// console.log(myArrary);

// let info2 = “”;
// for (let x in person) {
// info2 += x + “:” + person[x] + “\n” + person.x // x 代表 person 对象的属性，person[]代表属性值,注意这里 person[x]代表属性值，而 preson.x 不起作用因为 x 是一个变量,如果碰巧 person 对象里有名字为“x”的属性，则输出其值。
// }
// console.log(info2);

/_ arguments 对象 _/

// argument(形参) 用于描述（在函数内）期望被提供的值的名字
// parameter(实参) 用于描述（调用函数时）提供给每个形参的值

/* 运算符
// let num1=3;
// console.log(num1++); //3
// console.log(num1); //4

// let num2=3;
// console.log(++num2); //4
// console.log(num2); //4

// var num=0;
// num=num+2; //2
// num=num3; //6
// num=num/2; //3
// num++; //3
// num–; //
// console.log(num);
// num+=1;
// console.log(num);
// num-=2;
// console.log(num);
// num=3;
// console.log(num);
// num/=2;
// console.log(num);
// num%3;
// console.log(num);

= （赋值）==（相等） 与 ===（恒等），

对象运算符
In 判断左侧运算数是否是右侧运算数的成员
Instancesof 判断这个实例是否属于某个类或者构造函数
New 根据构造函数插件一个新的对象，并进行初始化
Delete 删除指定对象的属性、数组元素或者变量
. [] 存取对象和数组元素

*/

/_ 流程语句
/_ 循环语句 跳转语句
// 循环语句 ：
// do{ // 执行代码 }while(条件表达式)；
// while(条件表达式){ // 执行代码 }
// for(循环变量=初始值；循环条件；递增/减计算器){ //执行代码 }
// for(声明变量 in 对象){// 执行代码}

  // 跳转语句
    // return  运行return以后及跳出并终止函数，return以后的代码不会执行。
    // break  终止并跳出当前循环。
    // continue 终止并跳回到条件判断继续执行循环，直至判断条件为false结束循环。

    let a = 3 ;
        b = 1 ;
    // do{
    //   console.log(a + b);
    //   continue;   //结束本次循环，然后去判断是否实行下次循环
    //   console.log(a -b);
    //   break; // 终止循环，不再进行判断
    // }while(a > b);

    while(a > b){
      console.log(a + b);
      b++;
      // continue;
      break;
    }
*/

/* 选择语句

// if(条件表达式 1){
// // 执行代码;
// }else if(条件表达式 2){
// // 执行代码 2;
// }else{
// // 执行代码 3;
// }

// switch(条件表达式){
// case 标签 1： //case 是一个常量,可以是字符串或数字,每一个标签后面需要以: 结束
// // 执行代码 1;
// break;
// …
// Default:
// // 执行代码 n;
// }

// let a=6;
// b=6;

// if(a>b){
// console.log(a-b);
// }else if(a==b){
// console.log(‘a: ‘+ a + ‘, b: ‘+b)
// }else{
// console.log(b-a)
// }

// switch(a-b){
// case 0:
// console.log(a-b);
// break;
// case 1:
// console.log(a-b)
// break;
// Default:
// }
/
/ 异常处理语句
throw 主动抛出异常
try 指明需要处理的代码段
catch 捕获异常
finally 后期处理，无论是否有错误，都会执行
*/

/_ 其他语句_/
// debugger 调用任何咳哟个的调试功能，没有调试功能是该语句不起作用
// export
// import

/* 对象、实例、类、函数、数据类型和方法
在 JavaScript 中，对象、实例、类、函数、数据类型和方法是不同的概念，它们有着各自的含义和用途。

对象：对象是属性和方法的集合。在 JavaScript 中，几乎所有东西都是对象，包括字符串、数字、数组、函数、对象等。
类比：对象就像一台汽车，它由各种部件组成，比如发动机、轮胎、座椅等。每个部件都有它自己的属性，比如发动机有汽缸数、排量、功率等属性，轮胎有尺寸、胎压等属性。

实例：实例是通过类创建的对象。每个实例都具有类定义的属性和方法。在 JavaScript 中，使用 new 关键字创建实例。
类比：实例就像一辆具体的汽车，它是由汽车工厂根据设计图纸生产出来的。每辆汽车都具有相同的属性和方法，比如同一款车型的汽车都有相同的发动机、轮胎、座椅等。

类：类是一种用于创建对象的模板。在 JavaScript 中，类可以使用构造函数、类声明和类表达式来定义。
类比：类就像汽车工厂，它定义了汽车的基本设计图纸，并且能够根据设计图纸生产出具体的汽车。

函数：函数是一种可执行的代码块，可以接受参数并返回值。在 JavaScript 中，函数可以用来执行一些操作或计算。
类比：函数就像汽车的驾驶员，它可以控制汽车的运行，比如加速、刹车、转向等。

数据类型：数据类型指的是 JavaScript 中的基本数据类型，包括字符串、数字、布尔值、null 和 undefined。
类比：数据类型就像汽车的零部件，它们是汽车运行的基本构成单元，比如汽车需要发动机、轮胎等部件才能正常行驶。

字面量（Literal）是指表示特定数据类型的常量值，它是程序中直接出现的数据值，而不是由变量、函数或表达式计算得出的值。字面量可以表示各种不同的数据类型，例如字符串、数字、布尔值、数组、对象等。

方法：方法是对象中的函数，是可以对对象执行的操作。在 JavaScript 中，方法是对象的属性，其值为函数。
类比：方法就像汽车的功能，比如汽车可以加速、刹车、转向等。每个汽车都具有相同的功能，但具体实现可能有所不同。
属性：对象中的命名值成为属性 property ,属性的值为 value

综上所述，可以用汽车来类比解释对象、实例、类、函数、数据类型和方法的概念。汽车工厂就是类，设计图纸就是对象模板，每辆汽车就是实例，驾驶员就是函数，零部件就是数据类型，而汽车的功能就是方法。
*/

// 事件 Event
// 对 html 元素（elements）进行的操作,当 javascript 用于 html 时，这些事件 event 可以运行对应的 JavaScript
// 常见的用法是通过 事件 调用函数

// 典型的事件有，参见 html dom events：
// onchange
// onclick
// onmouseover
// onmouseout
// onload

/_ 类 class_/
// 类 class 是对象 object 的模板,注意类不是一个对象
// class ClassName {
// constructor(){……}
// }

// 使用类：
// class Car {
// constructor(name,year){
// this.name = name;
// this.year = year;
// }
// }

// const myCar1 = new Car(“Hoda”, 2017);
// console.log(myCar1.name); //Hoda
// console.log(myCar1.year); //2017

// 创建新的对象 object 时会自动调用（call）构造函数方法（constructor method）；
// 如果不定义构造函数方法，会自动添加一个空的构造函数方法；

// 类方法
// class ClassName {
// constructor() { … } //构造函数方法 constructor method
// method_1() { … } //类方法 class method
// method_2() { … }
// method_3() { … }
// }

// JSON
// 存储和传输数据的格式，主要用于网页请求。
// 数据存在 键 key/值 value 中，名字和值是配对出现的,单个数据样式为 “key”:”value”，
// 各数据以，分隔；
// 所有数据用{}包围；
// 数据中[]表示数组；

// 将 json 转换为 javascript 对象
// let text = ‘ json 字符串’; // 将 json 字符串存储到一个变量里
// const obj = JSON.parse(text); // 将 json 字符串转化为 JavaScript 对象。JSON.parse()是 JavaScript 的内置函数,用于将 JSON 转换为对象

// const myJSON = ‘{“name”:”John”, “age”:30, “cars”:[“Ford”, “BMW”, “Fiat”]}’;
// const myObj = JSON.parse(myJSON);
// let a = “”;
// for (const x in myObj.cars) {
// a += myObj.cars[x];
// };
// console.log(a); //FordBMWFiat

// console.log(myObj.cars[2]); //Fiat

// for (const y in myObj) {
// const val = ${y} + “ : “ + ${myObj[y]};
// console.log(val); // name : John age : 30 cars : Ford,BMW,Fiat
// };

// const cKey = Object.keys(myObj);
// const cArray = Object.values(myObj);
// console.log(cKey[2]); //cars
// console.log(cArray[2]); //[ ‘Ford’, ‘BMW’, ‘Fiat’ ]

// 代码风格

// 变量名称 Variable Name
// 1.使用 camelCase 作为标识符(identifier names)（变量 cariables 和函数 functions）
// camelCase （驼峰） 以小写字母开头，后续的单词首字母大写
// 2.在运算符（Operators)（ = + - * / ）的后面放空格
// 3.使用两个空格缩进代码块（不适用制表符进行缩进）
// 4.以；结束简单语句，复合语句后面不跟；
// 复杂（复合）的语句一般：将左阔行放在第一行的末尾，在左括号签放一个空格，将右括号放在新行，不带前导空格，不以；结束复杂语句（复合语句）。复合语句（compound satement）主要包括函数体（function body）\ 添加语句体（if statement body） \ 循环语句体（loop statement body）

// 全局变量 global variable
// 使用大写

// , 与 ；的用法区别
// 都是用于分隔语句的符号。
// ，用于分隔表达式（expression），可以在一个语句中包含多个表达式
// ；用于分隔语句(statement)，用于表示一个语句的结束

// 表达式（expression）与语句(statement)的用法区别
// 1.返回值
// 表达式：执行结果后返回一个值
// 语句：执行结果只是改变程序状态或控制流程，不返回值
// 2.赋值
// 表达式：可以作为赋值语句的右值
// 语句：不能在赋值语句中使用
// 3.独立存在
// 表达式可以独立存在
// 语句需要在函数体、流程语句中才能存在，不能独立存在