JS重要概念之对象与构造函数

2020-11-12  本文已影响0人  张先觉

#对象和构造函数

对象:,JS存储数据的一种数据结构例如:{ name: xiaoming }
构造函数: 用于创建对象的自定义函数,我们往往使用大驼峰命名的方式,与普通函数进行区分例如:function Teacher() {}
new关键字: 改变this的指向。

对象和构造函数之间的关系是怎么样的?

对象,借助new关键字,实例化构造函数而来。下面就是声明对象的三种方式:

  1. 使用系统自带的构造函数Object,实例化对象例如:var obj = new Object()
  2. 使用自定义构造函数,实例化对象例如:function Teacher(){};var obj = new Teacher();
  3. 使用字面量,实例化对象例如: var obj = {}

# 构造函数以及实例化的原理:new关键字this

Test()new Test()两种执行函数的方式,本质上没有什么不同。只是在使用new关键的时候,构造函数会事先隐式生成地声明一个this空对象,存到AO上下文中例如:AO.this = {};,以及最后返回结果的时候,会默认返回隐式生成的this对象例如:return AO.this;,而不是undefined。

// GO.this = {};
function Test() {
    console.log(this === window); // 打印结果是:true
}
Test();


// 使用new关键字执行函数的时候:
// GO.this = {};
function Test() {
    // var AO.this = {};
    console.log(this === window); // 打印结果是:false

    // 构造函数返回this
    // return AO.this;
}
new Test();
function Test(name, age) {
    var my_this = {};
    my_this.name = name;
    my_this.age = age;
    return my_this;
}
// 不使用new关键字,声明对象
var obj = Test('xiaoming', 18);
console.log(obj.name, obj.age);

#练习题:

原因:构造函数Test生成的AO对象因为闭包而不被销毁,当构造函数执行完毕之后,便会切断与AO对象的引用关系。就算下次还执行构造函数Test,它也会生成新的AO对象。


function Test(a,b,c) {
    var d = 1;
    this.a = a;
    this.b = b;
    this.c = c;

    function f() {
        d++;
        console.log(d);
    }

    this.g = f;
    // 隐式:return this; 形成闭包
}

var test1 = new Test();
test1.g();  // 打印结果:2
test1.g();  // 打印结果:3
test1.g();  // 打印结果:4

var test2 = new Test();
test2.g(); // 打印结果:2
test1.g(); // 打印结果:5
  1. 写一个“读书通知对象”,熟悉构造函数的使用某某人正在读某某书
function Book(opt) {
    this.name = opt.name;
    this.author = opt.author;
}

function Person(opt) {
    this.name = opt.name;
    this.age = opt.age;
    this.notice = function () {

        // 关键点;此处参数写法new Book(opt.bookOpt);
        var reading = new Book(opt.bookOpt);
        console.log(`${this.age}岁的${this.name}正在阅读${reading.author}的${reading.name}`);
    };
}

var Tom = new Person({
    name: "张三",
    age: 8,
    bookOpt: {
        name: "《庄子喃哗》",
        author: "南老头儿",
    },
});
Tom.notice(); // 结果: 8岁的张三正在阅读南老头儿的《庄子喃哗》

上一篇 下一篇

猜你喜欢

热点阅读