《JS原理、方法与实践》- 点运算符与this关键字

点运算符

点运算符可用来操作对象的属性。这里的操作可以分为获取和赋值两种类型。在赋值的情况下，假如对象原来没有所操作的属性则会增加，假如有则会修改其值。
代码示例：

var person = { name: 'zzh' };person.age = 18;console.log(person.name); // zzhperson.name = 'David';console.log(person.name); // David

测试结果

this的含义

书上说的三种子类型也不清楚是什么，暂且不做了解，只记一句话：

“谁直接调用方法，this就指向谁”。也就是说方法的点前面的对象就是this。
代码示例：

var color = 'red';function Obj () {    var color = 'balck';}Obj.color = 'green';Obj.prototype.logColor = function () {    console.log(this.color);}var o = new Obj();o.color = 'blue';o.logColor(); // blue

例子中一个有4个color， 一个是全局变量，一个是Obj的局部变量，一个是Obj的属性，还有一个是Obj创立的实例对象o的属性。logColor方法是Obj的prototype中的方法属性，其中打印了this.color的值。在调用o.logColor()时，这里使用使用对象o中的color属性，也就是blue,这是由于logColor方法是被o对象直接调用的。

关联方法后的this

代码示例：

function logColor() {    console.log(this.color);}function Obj () {}var o = new Obj();Obj.color = 'red';o.color = 'blud';Obj.logColor = logColor;o.logColor = logColor;Obj.logColor(); // redo.logColor(); // blue

谁调用方法this就指向谁！！！

内部函数中的this

代码示例：

var v = 1;function Program () {    var v = 2;    this.v = 3;}Program.prototype.logV = function () {    function innerLog () {        console.log(this.v);    }    innerLog();}var pro = new Program();pro.logV();  // 1

若希望打印出Program的this.v 即3， 有三种解决方法：
方法一：

Program.prototype.logV = function () {    var instance = this;    function innerLog () {        console.log(instance.v);    }    innerLog();}

方法二：

Program.prototype.logV = function () {    function innerLog () {        console.log(this.v);    }    this.innerLog = innerLog;    this.innerLog();}

方法三：

Program.prototype.logV = function () {    function innerLog (v) {        console.log(v);    }    innerLog(this.v);}

对象的属性不可以继承

属性不可以继承指的是，假如对象有多个层次，那么父子对象里的属性不可以相互继承和调用。
代码示例：

function logV() {    console.log(this.v);}var obj = {v: 1};obj.sonObj = {};obj.logV = logV;obj.sonObj.logV = logV;obj.logV(); // 1obj.sonObj.logV(); // undefined

之所以为undefined, 也是this的一种应用，此时obj.sonObj并没有定义属性v且没有继承ovj的v，所以打印其结果为undefined.

假如觉得文章写得还行，请点个赞。假如想与我进一步交流，可以关注我的公众号或者者加我的微信。

个人微信
公众号_前台微说.jpg