js对象

作者: _不能说的秘密i | 来源:发表于2019-11-17 20:31 被阅读0次

对象的分类

  • 内置对象
    在浏览器端, 内置对象主要分为两大类 BOMDOM
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);

相关文章

网友评论

      本文标题:js对象

      本文链接:https://www.haomeiwen.com/subject/iklmictx.html