Penjelasan terperinci tentang penggunaan dan perbezaan ini, hubungi dan gunakan dalam JavaScript

Dalam pembelajaran JavaScript saya sebelum ini, ini, panggilan dan gunakan sentiasa mengelirukan saya, tetapi ia digunakan secara meluas. Jadi saya menghabiskan masa seharian untuk memahami JavaScript ini, hubungi dan gunakan.

Terdapat juga banyak buku yang saya rujuk sepanjang perjalanan, terutamanya "Corak Reka Bentuk JavaScript dan Amalan Pembangunan", ditambah dengan "Pengaturcaraan Lanjutan JavaScript" dan "JavaScript yang Anda Tidak Tahu". Ketiga-tiga buku ini telah banyak membantu saya dalam memahami perkara ini, memanggil, dan memohon.

Mula-mula, mari kita bincangkan perkara ini.

Dalam huraian ini dalam "Corak Reka Bentuk JavaScript dan Amalan Pembangunan", saya rasa ada ayat yang menyentuh intipati perkara ini. Iaitu:

Ini dalam JavaScript sentiasa menunjuk ke objek
Dalam aplikasi praktikal, penunjuk ini boleh dibahagikan kepada empat jenis berikut:

1. Sebagaimana Kaedah objek memanggil

2. sebagai fungsi biasa memanggil

3. Panggilan Pembina

4. memohon dan memanggil Memanggil

Penjelasan: Apabila memanggil kaedah sebagai objek, ini menunjuk kepada objek. Contoh:

/**
 * 1.作为对象的方法调用
 *
 * 作为对象方法调用时，this指向该对象。
 */

var obj = {
 a: 1,
 getA: function() {
  console.log(this === obj);
  console.log(this.a);
 }
};

obj.getA(); // true , 1

Nota: Apabila dipanggil sebagai fungsi biasa, ini sentiasa. menunjuk ke objek Global (tetingkap dalam pelayar). Contoh:

/**
 * 2.作为普通函数调用
 *
 * 不作为对象属性调用时,this必须指向一个对象。那就是全局对象。
 */

window.name = 'globalName';

var getName = function() {
 console.log(this.name);
};

getName(); // 'globalName'

var myObject = {
 name: "ObjectName",
 getName: function() {
  console.log(this.name)
 }
};

myObject.getName(); // 'ObjectName'

// 这里实质上是把function() {console.log(this.name)}
// 这句话赋值给了theName。thisName在全局对象中调用，自然读取的是全局对象的name值
var theName = myObject.getName;

theName(); // 'globalName'

Penjelasan: Apabila dipanggil sebagai pembina, ini menunjukkan kepada yang dikembalikan. objek. Contoh:

/**
 * 3.作为构造器调用
 * 
 * 作为构造器调用时，this指向返回的这个对象。
 */

var myClass = function() {
 this.name = "Lxxyx";
};

var obj = new myClass();

console.log(obj.name); // Lxxyx
console.log(obj) // myClass {name: "Lxxyx"}

var myClass = function() {
 this.name = "Lxxyx";
 // 加入return时，则返回的是别的对象。this不起作用。
 return {
  name:"ReturnOthers"
 }
};

var obj = new myClass();
console.log(obj.name); // ReturnOthers

Panggil dan Mohon mempunyai tujuan yang sama. Kesemuanya digunakan untuk menentukan penunjuk ini dalam badan fungsi.

Panggilan: Parameter pertama ialah penunjuk kepada ini, dan parameter yang akan dihantar ke fungsi mesti dimasukkan satu demi satu . Gunakan: Parameter pertama ialah penunjuk kepada ini, parameter kedua ialah tatasusunan dan semua parameter dihantar serentak.

1. Tukar ini untuk menunjuk kepada

Penjelasan: Ini adalah penggunaan panggilan dan permohonan yang paling biasa. Digunakan untuk menukar penunjuk ini dalam badan fungsi.

var name = "GlobalName"

var func = function() {
 console.log(this.name)
};

func(); // "GlobalName"

var obj = {
 name: "Lxxyx",
 getName: function() {
  console.log(this.name)
 }
};

obj.getName.apply(window) // "GlobalName" 将this指向window
func.apply(obj) // "Lxxyx" 将this指向obj

(function(a, b) {
 console.log(arguments) // 1,2
 // 调用Array的原型方法
 Array.prototype.push.call(arguments, 3);
 console.log(arguments) // 1,2,3
})(1,2)

Bahagian kandungan ini agak rumit, dan saya juga tidak begitu mahir. Oleh itu, saya mengesyorkan pelajar yang berkelayakan untuk membeli buku yang berkaitan, atau menunggu artikel blog susulan saya.

function ArrayPush() {
 var n = TO_UINT32(this.length); // 被push对象的长度
 var m = % _ArgumentsLength(); // push的参数个数
 for (var i = 0; i < m; i++) {
  this[i + n] = % _Arguments(i); // 复制元素
 }
 this.length = n + m; //修正length属性
 return this.length;
}

Dengan mempelajari bahagian ini, saya telah mendalami pemahaman saya tentang JavaScript. Manifestasi yang paling intuitif ialah apabila melihat kod sumber beberapa rangka kerja yang sangat baik, anda tidak lagi keliru dengan ini, memanggil, memohon dan mengikat. Masih sangat gembira~

Dalam tempoh masa yang akan datang, saya akan meneroka secara mendalam CSS yang saya pelajari dan gunakan setiap hari. Lagipun, selepas belajar JavaScript, HTML dan CSS tidak boleh ketinggalan.

【Tutorial berkaitan yang disyorkan】1

Manual dalam talian JavaScript

3 tutorial bootstrap