JavaScript 对象

1. 对象

1.1 对象基本概念

 a. 对象属性

1. 对象也是变量，内部可以包含多个变量(name: value), 对象就是相当于是属性与方法的容器.
2. 对象属性访问有两种方法
   a. 对象.属性名 -> Object.name
   b. 对象[“属性名字”] -> Object[“name”]

// 对象创建, 注意属性之间需要逗号隔开
var student = { 
    name: "学生A",
    age: 12,
    hobby: "篮球"
};

console.log(student.name + " " + student["age"] + " " + student.hobby);

 b. 对象方法

// 方法定义格式 -> objectName.methodName()调用
methodName : function() {
    // 代码 
}

// 方法与属性之间也依旧需要逗号相隔
var student = { 
    name: "学生A",
    age: 12,
    hobby: "篮球",

    SayName: function () {
        console.log(this.name);
    },
    SayAge: function () {
        console.log(this.age);
    }

};
student.SayName(); // 对象方法调用

 

1.2 对象作用域

  a. 浏览器环境当中拥有一个顶层对象window, 所有的对象都是这个顶层对象的下属对象.

var x = 1;
console.log(window.x); // window顶层对象
console.log(x); // 顶层对象window可以省略

  b. 函数内变量属于局部变量，不能在函数外进行调用，在一切规范操作下，默认是局部优先，并且不会对外部同名变量进行覆盖。若内部变量未使用var关键字会将其上升为全局变量.

function myFunction() {
    var x = 2;
}
console.log(x); // 不能在函数外使用，报错

var x = 1;
function myFunction() {
    var x = 2;
    console.log(x); // 2 -> 局部优先原则
};
myFunction();

var x = 1;
function myFunction() {
    x = 2; // 没有设立var, 该变量会上升为全局变量.
}
myFunction();
console.log(x); // 2

var x = 1;
function myFunction() {
    x = 2; // 没有设立var, 该变量会上升为全局变量
}
// 编译是不会将方法内变量上升的，需要调用方法的运行才会生效覆盖
console.log(x); // 1

 

2. this引用

2.1 一般情况

1. 我们知道其实最顶层对象就是默认的window对象，所以在这我们只分析window层和window环境内的对象，我们只需要认识这两层对象的关系即可，其他如果你有多层它的关系就都是类似的，类比去看就行
2. 核心：在全局范围内调用的函数或者变量引用都是指向全局对象window, 在window子层对象当中使用的this也是类似的代指向该子层对象。[在哪个对象作用范围内使用其就指向谁]
3. 关键: 哪个对象调用我，我就指向谁。

var x = this;
var MyFunction = function(){
	return this; // 严格模式是undefined
}
console.log(x); // window对象
console.log(this.MyFunction()); // window对象

var op = {
	x: 1,
    MyFunction1: function(){ // 指向该对象op
    	return this.x;
    },
    MyFunction2: function(){ // 指向该对象op
    	return this;
    },
  	// 特例 -> 在对象当中使用匿名函数会指向全局对象window(可能内部匿名函数初始化是window对象完成)
    MyFunction3: (function(){ 
    	console.log(this);
        // 不能使用 return, 会报错
    })()
};

console.log(op.MyFunction1()); // 1
console.log(op.MyFunction2()); // 对象op
// op.MyFunction3(); 不能调用匿名函数, 报错

 

2.2 强制转换对象引用(call)

1. call当中你放入哪个对象，就是哪个对象去使用这个方法.(显示函数绑定)

var person1 = {
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
}
var person2 = {
  firstName:"John",
  lastName: "Doe",
}
var name = person1.fullName.call(person2); 
console.log(name); // John Doe