1.对象
访问属性，函数：
- x.y
- x[“y”]

let person = {
    name: "yxc",
    age: 18,
    money: 0,
    friends:['Bob','Alice','Lucy'],
    clothes:{
        color:"red",
        price:20,
    },
    add_money: function (x) {
        this.money += x;
        //函数里的this:返回拥有函数的对象
    }
};

console.log(person.age,person.friends[2],person.money);
person.add_money(2);
console.log(person.money,person["name"]);

2.数组
数组的元素种类可以不一样
使用下标（从0开始）访问

let a = [1, 2, "a", "yxc"];
let b = [
    1,  // 变量
    "yxc",  // 变量
    ['a', 'b', 3],  // 数组
    function () {  // 函数
        console.log("Hello World");
    },
    { name: "yxc", age: 18 }  // 对象
];
console.log(b[2],b[4]["age"]);

数组的属性和函数
1. .length 长度
2. .push() 末尾添加元素
3. .pop() 末尾删除元素
4. .splice(a,b) 删除从a开始的b个元素
5. .sort() 从小到大排序，可使用.sort(cmp),cmp(x,y)需要返回x-y的值，即正数、0或负数

let c=[16,-998,44,0,36];
c.sort(function (a,b){
    return b-a;
});
for(let i=0;i<c.length;i++)
    console.log(c[i]);

3.函数

function add(a, b) {
    return a + b;
}

let add = function (a, b) {
    return a + b;
}

let add = (a, b) => {
    return a + b;
}

4.类
- 创建类

class Point {
    constructor(x, y) {  // 构造函数
        this.x = x;  // 成员变量
        this.y = y;

        this.init();
    }

    init() {
        this.sum = this.x + this.y;  // 成员变量可以在任意的成员函数中定义
    }

    toString() {  // 成员函数
        return '(' + this.x + ', ' + this.y + ')';
    }
}

let p = new Point(3, 4);
console.log(p.toString());

• 继承
  成员重名时，子类的成员会覆盖父类的成员
  可在子类调用父类静态变量和方法

class ColorPoint extends Point {
    constructor(x, y, color) {
        super(x, y); // 这里的super表示父类的构造函数
        this.color = color; //上下两行顺序不能颠倒
    }

    toString() {
        return this.color + ' ' + super.toString(); // 调用父类的toString()
    }
}
let p = new ColorPoint(1,2,"red");

• 静态方法
  在成员函数前添加static关键字
  静态方法只能通过类来调用

class Point {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }

    toString() {
        return '(' + this.x + ', ' + this.y + ')';
    }

    static print_class_name() {
        console.log("Point");
    }
}

let p = new Point(1, 2);
Point.print_class_name();
p.print_class_name();  // 会报错

• 静态变量
  由类调用

class Point {
    constructor(x, y) {
        this.x = x;
        this.y = y;

        Point.cnt++;
    }

    toString() {
        return '(' + this.x + ', ' + this.y + ')';
    }
}

Point.cnt = 0;

5.事件
可以通过addEventListener函数为元素绑定事件的触发函数
常见的触发函数:
1. 鼠标
- click：鼠标左键点击
- dblclick：鼠标左键双击
- contextmenu：鼠标右键点击
- mousedown：鼠标按下，包括左键、滚轮、右键
- event.button：0表示左键，1表示中键，2表示右键
- mouseup：鼠标弹起，包括左键、滚轮、右键
- event.button：0表示左键，1表示中键，2表示右键
2. 键盘
keydown、keyup、keypress的关系类似于鼠标的mousedown、mouseup、click
- keydown：某个键是否被按住，事件会连续触发
- event.code：返回按的是哪个键
- event.altKey、event.ctrlKey、event.shiftKey分别表示是否同时按下了alt、ctrl、shift键
- keyup：某个按键是否被释放
- keypress：紧跟在keydown事件后触发，只有按下字符键时触发
3. 表单
- focus：聚焦某个元素
- blur：取消聚焦某个元素
- change：某个元素的内容发生了改变
4. 窗口
需要作用到window元素上。
- resize：当窗口大小放生变化
- scroll：滚动指定的元素
- load：当元素被加载完成

<div></div>
<input type="text">

let div=document.querySelector("div");
let input=document.querySelector("input");
div.addEventListener("mousedown",function(event){
    console.log(event.type,event.button);
})
input.addEventListener("keypress",function(event){
    console.log(event.code);
})
input.addEventListener("focus",function(event){
    console.log(event.type);
})
window.addEventListener("resize",function(event){
    console.log(event.type);
})