JavaScript對象中的this指向及其修改

 

一、對象中的this指向及其修改

1、屬性事件的this，在標簽內調用事件函數

①誰調用this所在的函數，就指向誰

a、如果this作為參數傳入，那么this就是指向input 

 

b、如果不在標簽的方法中傳入this，那么方法中打印this時一般指向window

 

  2、onclick事件中的this（返回該標簽）

3、構造函數中的this（this指向當前實例化的具體的對象（誰調用this所在的函數，那么this就指向誰））

function fn(name,sex,age){
	this.name = name;
	this.sex = sex;
	this.age = age;
}
var a = new fn('小明','男',18);

　　

打印a的值： 

4、原型方法中的this（誰調用this所在的函數，那么this就指向誰）

Array.prototype.pt = function() {
	console.log(this)
}
var a = [1,2,3,4]
console.log(a.pt())    // (4) [1, 2, 3, 4]

　　

5、對象方法中的this

對象==普通屬性+方法屬性

這里的this指向obj(誰調用this所在的函數，那么this就指向誰。)

var obj = {
    name:'張三',
    fn:function(){
        console.log("你好，我叫"+this.name);    ///你好，我叫張三
    }
}

　　

二、深拷貝和淺拷貝

1、淺層拷貝

在拷貝時，對於屬性值為引用類型的屬性也只會拷貝其地址，而不是具體的值，這會導致我們修改了拷貝后的引用類型數據時會影響到原對象中的引用類型屬性。

a、通過for in遍歷實現

b、通過Object.assign方法實現 

 

 2、深層拷貝

    var obj = {
        name: "zs",
        teg: ["數據結構", "算法", "設計模式"],
        children: {
            name: "zs_1",
            sex: "女",
            age: 3
        }
    }
 
    function fn(obj) {
        var newObj = obj instanceof Array ? [] : {}
        for (let k in obj) {
            newObj[k] = typeof obj[k] === 'object' ? fn(obj[k]) : obj[k];
        }
        return newObj;
    }

　　

 

2、通過JSON方法轉換實現

先用JSON.stringify方法把對象轉換為字符串

在用JSON.parse()方法把字符串轉為對象

JSON方法如果對象里面出現方法會顯示不出來

三、構造函數與實例對象

1、構造函數

 

function Person(name,age){
     this.name = name;    
     this.age = age;   
     this.sayHello = function(){   
         console.log(this.name +"say hello");
    }
}
 
var boy = new Person("bella",23);    
boy.sayHello(); // bella say hello

　　

構造函數的特點：

　　　　a:構造函數的首字母必須大寫，用來區分於普通函數

　　　　b:內部使用的this對象，來指向即將要生成的實例對象

　　　　c:使用New來生成實例對象

2、實例對象

實例對象能夠訪問構造他的抽象類型原型上的屬性和方法

 

Array.prototype.pt = function() {
	console.log(this)
}
var a = [1,2,3,4]
console.log(a.pt())    // (4) [1, 2, 3, 4]

　　

四、原型對象的作用

這些類型的實例都可以繼承此原型上的屬性和方法。

 

原文：https://blog.csdn.net/qq_41945935/article/details/90411571