js对象

对象的分类

• 内置对象
  在浏览器端, 内置对象主要分为两大类 BOM 和 DOM

let date = new Date(); // 日期对象
let rnum = Math.random(); // 数据对象->获取随机数

• 自定义对象
  通过第三方包或者自定义的函数,类创建的对象就是自定义对象

let jq = $("#app");    // jquery 对象
let moment = moment(); // moment 对象

对象的组成

• 属性
• 方法

var obj = {
    name: "object",
    run: function () {
        console.log("run");
    }
}

创建对象的方式

• 直接创建

let user = {
    id: 1001,
    name: "test",
    run: function () {
        console.log("run");
    },
};

• new Object

let user = new Object();
user.id = 1001;
user.name = "test";
user.run = function () {
    console.log("run");
};

• 自定义类创建

// es5
function User(id, name) {
    this.id = id;
    this.name = name;
    this.run = function() {
        console.log("run");
    };
}
let user = new User(100, "test1");

// es6(推荐)
class User {
    constructor(id, name) {
        this.id = id;
        this.name = name;
    }

    run() {
       console.log("run");
    }
}

let user = new User(101, "test2");

对象属性/方法的划分

• 静态属性/方法: 属于类, 所有生成的对象的属性/方法都一样
• 实例属性/方法: 属于对象, 各个对象的属性 相互独立

class User {
    static eyeNumber = 2;
    constructor(id, name) {
        this.id = id;
        this.name = name;
    }

    static run() {
       console.log("run");
    }
    
    say() {
        console.log("say");
    }
}

let user = new User(101, "test2");
console.log(user);

[图片上传失败...(image-5efcb9-1573993913502)]

由上图可以看到, 打印的这个对象没有 run 方法, 也没有 eyeNumber 这个属性

补充: 以上代码的 es5 版本

function User(id, name) {
    this.id = id;
    this.name = name;
    this.say = function () {
        console.log("say");
    }
}

User.prototype.eyeNumber = 2;
User.prototype.run = function () {
    console.log("run");
}

var user = new User(101, "test2");
console.log(user);