对象使用

执行下面的代码，声明对象并访问其属性。

let obj = {
    name: 'Tom',
    age: 18,
    'user-name': 'Tom'
};
console.log(obj);
console.log(obj.name);
console.log(obj.age);
console.log(obj['user-name']);

执行下面的代码，删除对象中的指定属性。

let obj = {
    name: 'Tom',
    age: 18
};
console.log(obj);
delete obj.name;
console.log(obj);
console.log(obj.name);

执行下面的代码，声明对象并访问其方法。

let obj = {
    func: function() {
        return 'Hello World!';
    }
};
console.log(obj);
console.log(obj.func());

执行下面的代码，遍历对象中的所有属性与方法。

let obj = {
    name: 'Tom',
    age: 18,
    func: function () {
        return 'Hello World!';
    }
};
console.log(Object.keys(obj));
console.log(Object.values(obj));
console.log(Object.entries(obj));
for (let k in obj) {
    console.log(k, obj[k]);
}

执行下面的代码，使用 Symbol 作为对象属性名或方法名。

let name = Symbol();
let age = Symbol();
let func = Symbol();
let obj = {
    [name]: 'Tom',
    [age]: 18,
    [func]: function () {
        return 'Hello World!';
    }
};
console.log(obj);
console.log(obj[name]);
console.log(obj[age]);
console.log(obj[func]());

执行下面的代码，使用解构语法为变量赋值。

let obj = {
    name: 'Tom',
    age: 18
};
let { name, age } = obj;
console.log(name);
console.log(age);

构造函数是一种特殊的函数，主要用来初始化对象。

function Person(name, age) {
    this.name = name;
    this.age = age;
}
const Tom = new Person('Tom', 20);
const Jerry = new Person('Jerry', 18);
console.log(Tom);
console.log(Jerry);

构造函数的属性和方法被称为静态属性和静态方法。

function Person() {}
Person.username = 'anonymous';
Person.call = function() {
    console.log('Hello World!');
}
console.log(Person.username);
Person.call();

在 JavaScript 中所有构造函数中都存在一个原型对象。

function Person(name, age) {
    this.name = name;
    this.age = age;
}
Person.prototype.call = function() {
    console.log('Hello World!');
}
const Tom = new Person('Tom', 20);
const Jerry = new Person('Jerry', 18);
console.log(Tom);
Tom.call();
console.log(Jerry);
Jerry.call()

执行下面的代码，用定义类的方式来声明对象。

class Person {
    name = 'anonymous';
    age = 18;
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
}
const Tom = new Person('tom', 20);
console.log(Tom);

执行下面的代码，实现类的继承。

class Person {
    name = 'anonymous';
    age = 18;
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
    func() {
        return [this.name, this.age];
    }
}
class SmartPerson extends Person {
    gender;
    constructor(name, age, gender) {
        super(name, age);
        this.gender = gender;
    }
    func() {
        return [this.name, this.age, this.gender];
    }
}
const Tom = new Person('tom', 20);
console.log(Tom);
console.log(Tom.func());
const Jerry = new SmartPerson('jerry', 18, 'female');
console.log(Jerry);
console.log(Jerry.func());

执行下面的代码，定义并访问对象中的私有属性。

class Person {
    name = 'anonymous';
    #age = 18;
    constructor(name, age) {
        this.name = name;
        this.#age = age;
    }
    func() {
        return this.#age;
    }
}
const Tom = new Person('tom', 20);
console.log(Tom);
console.log(Tom.name);
console.log(Tom.func());

执行下面的代码，自定义类的读取和修改行为。

class Person {
    name = 'anonymous';
    get name() {
        return this.name;
    }
    set name(name) {
        this.name = name;
    }
}
const Tom = new Person();
console.log(Tom.name);
Tom.name = 'tom';
console.log(Tom.name);

执行下面的代码，使用可选链操作符访问指定变量。

const person = {
    name: 'tom',
    age: 20,
    call: {
        foo: 'bar',
        func: () => 'Hello World!'
    }
};
console.log(person?.call?.foo);
console.log(person?.call?.bar);
console.log(person?.call?.func());

执行下面的代码，使用空值合并操作符访问指定变量。

let num;
console.log(num ?? 233);
num ??= 233;
console.log(num);

Math 对象中包含了 JavaScript 提供的一系列数学运算方法。

console.log(Math.random());
console.log(Math.ceil(3.7));
console.log(Math.floor(3.7));
console.log(Math.max(1, 2, 3));
console.log(Math.min(1, 2, 3));
console.log(Math.pow(3, 2));
console.log(Math.abs(-233));
console.log(Math.trunc(3.5));
console.log(Math.sign(100));
console.log(Math.sign(0));
console.log(Math.sign(-100));

function equal(a, b) {
    return Math.abs(a - b) < Number.EPSILON;
}
console.log(0.1 + 0.2 === 0.3);
console.log(equal(0.1 + 0.2, 0.3));

Number 对象包含了 JavaScript 提供的一系列数值处理方法。

console.log(Number.isFinite(100));
console.log(Number.isFinite(100 / 0));
console.log(Number.isFinite(Infinity));
console.log(Number.isNaN(233));
console.log(Number.isInteger(666));
console.log(Number.isInteger(1.23));
console.log(Number.parseInt('233Hello'));
console.log(Number.parseFloat('3.1415926World'));

Date 对象中包含了 JavaScript 提供的一系列日期操作方法。

const date = new Date();
console.log(date);
console.log(date.getFullYear());
console.log(date.getMonth());
console.log(date.getDay());
console.log(date.getHours());
console.log(date.getMinutes());
console.log(date.getSeconds());
console.log(Date.now());

Object 对象中包含了 JavaScript 提供的一系列对象操作方法。

console.log(Object.is(233, 233));
console.log(Object.is(NaN, NaN));
let obj1 = {
    name: 'Tom',
    age: 20,
    func: function () {
        return 'Hello World!';
    }
};
let obj2 = {
    name: 'Jerry',
    age: 18
};
console.log(Object.assign(obj1, obj2));

ES11 引入了 globalThis 内置对象，目的是为所有 JavaScript 运行环境提供标准化接口来访问全局对象。

console.log(globalThis);

执行下面的代码，控制浏览器前进与后退。

history.back();
history.forward();