alert("Hello");
[1, 2].forEach(alert);

/**/不支持嵌套.

变量名称有两个限制:
1,名称必须仅包含字母,数字或$和_符号.
2,第一个字符不能是数字

反引号串:

let name = "哈哈";
alert( `你好, ${name}!` );
alert( `结果是${1 + 2}` );

调用typeof(运算符)将返回一个类型名称串.

提示函数:result = prompt(title, [default]);

转换:

value = String(value);
let num = Number(str);

两个运算:%(余)与**(幂).

如果任何操作数是串,则另一个操作数也会转换为串.

alert( '1' + 2 ); // "12"
alert( 2 + '1' ); // "21"

链接赋值:

a = b = c = 2 + 2;

常见位操作:
和(&)
或(|)
异或(^)
非(~)
左移(<<)
右移(>>)
零填充右移(>>>).

===为严格相等,不仅值,而且类型相等!

??

a??b的结果是:
如果定义了a,则a,
如果未定义a,则为b.
||返回第1个真的.
??返回第1个定义了的值.只在null/undefined时用默认值.

let height = 0;

alert(height || 100); // 100
alert(height ?? 100); // 0
//一般,0高度为有效值.

可带标签退出:

outer: for (let i = 0; i < 3; i++) {
  for (let j = 0; j < 3; j++) {
    let input = prompt(`Value at coords (${i},${j})`, '');
    // 退出2层循环.
    if (!input) break outer; // (*)
    // 处理...
  }
}

alert('Done!');

continue,也可以用.

label: {
  // ...
  break label; // 工作
  // ...
}
//如下
break label; // 下跳,不工作!

label: for (...)

猜,可以为串:

switch(x) {
  case 'value1':  // if (x === 'value1')
    ...
    [break]

  case 'value2':  // if (x === 'value2')
    ...
    [break]

  default:
    ...
    [break]
}

Js可以看见后面函数:

sayHi("John"); // Hello, John

function sayHi(name) {
  alert( `Hello, ${name}` );
}

对象

let user = {};

// 置
user["likes birds"] = true;
// 取
alert(user["likes birds"]); // 真
// 删
delete user["likes birds"];

计算属性

let fruit = prompt("Which fruit to buy?", "apple");

let bag = {
  [fruit]: 5,
};

alert( bag.apple ); // 

//等价于
let fruit = prompt("Which fruit to buy?", "apple");
let bag = {};
bag[fruit] = 5;

区分in

let obj = {
  test: undefined
};

alert( obj.test ); // 它未定义,还是没有?
alert( "test" in obj );

常与引用

const user = {
  name: "John"
};

user.name = "Pete"; // (*)
alert(user.name); // Pete

复制对象

let user = {
  name: "John",
  age: 30
};

let clone = Object.assign({}, user);

alert(clone.name); // John
alert(clone.age); // 30

深度克隆

let user = {
  name: "John",
  sizes: {
    height: 182,
    width: 50
  }
};

let clone = structuredClone(user);

alert( user.sizes === clone.sizes );
// 不同对象.

user.sizes.width = 60;
// 更改
alert(clone.sizes.width); // 不相关.

let html = document.querySelector('.elem').innerHTML; 
// error if it's null

如果既不是null且不是undefined,则说它"存在".
换句话说,?.prop中:
如果存在值,作按值.prop工作,
否则(当值为undefined/null时),它返回undefined.

let user = {}; // 无地址

alert( user?.address?.street ); //未定义,但无错.

可用:

let html = document.querySelector('.elem')?.innerHTML;

替换上面.

调用可能不存在的函数:

let userAdmin = {
  admin() {
    alert("I am admin");
  }
};

let userGuest = {};
userAdmin.admin?.(); // I am admin
userGuest.admin?.();

可能不存在的

let key = "firstName";

let user1 = {
  firstName: "John"
};

let user2 = null;

alert( user1?.[key] ); // John
alert( user2?.[key] ); // undefined

存在则删

delete user?.name;

符号

let id1 = Symbol("id");
let id2 = Symbol("id");

alert(id1 == id2); // false
let id = Symbol("id");
alert(id.toString());//显式转换为串

不是

let id = Symbol("id");

let user = {
  name: "John",
  [id]: 123 // 不是"id": 123
};

for in 不访问符号

let id = Symbol("id");
let user = {
  name: "John",
  age: 30,
  [id]: 123
};

for (let key in user) alert(key);
alert( "Direct: " + user[id] );

表层克隆

let id = Symbol("id");
let user = {
  [id]: 123
};

let clone = Object.assign({}, user);
alert( clone[id] ); // 123,会有它.

变参

function sumAll(...args) { // 
  let sum = 0;

  for (let arg of args) sum += arg;

  return sum;
}

alert( sumAll(1) ); // 1
alert( sumAll(1, 2) ); // 3
alert( sumAll(1, 2, 3) ); // 6

扩展

let arr = [3, 5, 1];
alert( Math.max(...arr) );

let arr = [3, 5, 1];
let arr2 = [8, 9, 15];

let merged = [0, ...arr, 2, ...arr2];
//合并.
let arr = [1, 2, 3];
let arrCopy = [...arr];
//复制数组
let obj = { a: 1, b: 2, c: 3 };
let objCopy = { ...obj };
//复制对象

类

class MyClass {
  // 类方法.
  constructor() { ... }
  method1() { ... }
  method2() { ... }
  method3() { ... }
  ...
}

按钮

class Button {
  constructor(value) {
    this.value = value;
  }
  click = () => {
    alert(this.value);
  }
}

let button = new Button("hello");

setTimeout(button.click, 1000); // hello

继承

class Animal {
  constructor(name) {
    this.speed = 0;
    this.name = name;
  }
  run(speed) {
    this.speed = speed;
    alert(`${this.name} runs with speed ${this.speed}.`);
  }
  stop() {
    this.speed = 0;
    alert(`${this.name} stands still.`);
  }
}

let animal = new Animal("My animal");

兔子继承:

class Rabbit extends Animal {
  hide() {
    alert(`${this.name} hides!`);
  }
}

let rabbit = new Rabbit("White Rabbit");

rabbit.run(5); // 5速度.
rabbit.hide(); // 隐藏!

根据条件生成类

function f(phrase) {
  return class {
    sayHi() { alert(phrase); }
  };
}

class User extends f("Hello") {}
new User().sayHi(); // Hello

覆盖方法

class Animal {

  constructor(name) {
    this.speed = 0;
    this.name = name;
  }

  run(speed) {
    this.speed = speed;
    alert(`${this.name} runs with speed ${this.speed}.`);
  }

  stop() {
    this.speed = 0;
    alert(`${this.name} stands still.`);
  }

}

class Rabbit extends Animal {
  hide() {
    alert(`${this.name} hides!`);
  }

  stop() {
    super.stop(); // 调用父的
    this.hide(); // 然后停止.
  }
}

let rabbit = new Rabbit("White Rabbit");
rabbit.run(5); // 5.
rabbit.stop(); // 不动,隐藏

默认继承

class Rabbit extends Animal {
  // 空的,则生成.
  constructor(...args) {
    super(...args);
  }
}

继承构造函数必须调用super才能执行其父(基本)构造函数,否则不会为它创建对象.

class Rabbit extends Animal {

  constructor(name, earLength) {
    super(name);
    this.earLength = earLength;
  }
  // ...
}
// now fine
let rabbit = new Rabbit("White Rabbit", 10);
alert(rabbit.name); // White Rabbit
alert(rabbit.earLength); // 10