Perbincangan ringkas tentang penggunaan call(), apply() dan bind() dalam kemahiran javascript_javascript

Fungsi dalam JavaScript bukan sahaja ciri bahasa yang serupa dengan kaedah dalam Java, ia juga boleh wujud sebagai objek. Artikel ini akan meneroka beberapa kegunaan khas fungsi dalam JavaScript, termasuk tiga kaedah prototaip untuk memanggil, memohon dan mengikat.
1. Asas fungsi
Fungsi dalam JavaScript ialah ciri bahasa yang serupa dengan kaedah dalam Java, tetapi ia boleh ditakrifkan secara bebas daripada kelas.

Pengaturcaraan fungsian: Oleh kerana JavaScript menyokong fungsi tanpa nama, fungsi boleh digunakan sebagai objek Oleh itu, JavaScript bukan sahaja menyokong pengaturcaraan prosedur (berorientasikan objek juga merupakan jenis pengaturcaraan prosedur), tetapi juga menyokong pengaturcaraan berfungsi.
Konteks

Setiap panggilan ke fungsi akan mempunyai nilai istimewa - konteks panggilan ini - ini ialah nilai kata kunci ini. Jika fungsi dipasang pada objek sebagai sifat objek, ia dipanggil kaedah objek. Apabila fungsi dipanggil melalui objek ini, objek adalah konteks panggilan, yang merupakan nilai fungsi ini.

Perlu diambil perhatian bahawa ini ialah kata kunci, bukan pembolehubah atau nama atribut. Sintaks JavaScript tidak membenarkan memberikan nilai kepada ini.

Fungsi ialah sejenis objek

Perbezaan terbesar antara fungsi dalam JavaScript dan kaedah dalam Java atau fungsi dalam bahasa C ialah fungsi dalam JavaScript juga merupakan objek. Tetapi ini tidak bermakna bahawa semua objek adalah fungsi. Fungsi ialah objek khas yang mengandungi kod boleh laku dan boleh dipanggil oleh kod lain.

Tidak seperti pembolehubah, kata kunci ini tidak mempunyai sekatan skop dan fungsi bersarang tidak mewarisi ini daripada fungsi yang memanggilnya. - Jika fungsi bersarang dipanggil sebagai kaedah, nilai ini menunjukkan kepada objek yang memanggilnya. - Jika fungsi bersarang dipanggil sebagai fungsi, nilai ini sama ada objek global (dalam mod tidak ketat) atau tidak ditentukan (dalam mod ketat).

Ramai orang tersilap percaya bahawa apabila memanggil fungsi bersarang, ini akan menunjukkan kepada konteks fungsi luar. Jika anda ingin mengakses nilai ini bagi fungsi luaran ini, anda perlu menyimpan nilai ini dalam pembolehubah ini dan fungsi dalaman kedua-duanya dalam skop yang sama. Contohnya:

var o = {
 m: function() {
  var self = this;
  console.log(this==o); // true
  f();
  
  function f() {
   console.log(this === o); // false，this的值是全局对象或undefined
   console.log(self === o); // true
  }
 }
}

Penutupan

Fungsi JavaScript boleh ditakrifkan bersarang dalam fungsi lain supaya mereka boleh mengakses sebarang pembolehubah dalam skop di mana ia ditakrifkan. Ini bermakna bahawa fungsi JavaScript membentuk penutupan, yang membawa keupayaan pengaturcaraan yang sangat berkuasa kepada JavaScript.

sebagai fungsi nilai
Dalam JavaScript, fungsi bukan sahaja sintaks, tetapi juga nilai, maksudnya, fungsi boleh diberikan kepada pembolehubah, disimpan dalam sifat objek atau elemen tatasusunan, dihantar ke fungsi lain sebagai. parameter, dsb.

ikat, panggil, mohon
Setiap fungsi mengandungi atribut prototaip, yang merupakan rujukan kepada objek ini dipanggil "objek prototaip". Setiap fungsi mengandungi objek prototaip yang berbeza. Apabila menggunakan fungsi sebagai pembina, objek yang baru dicipta mewarisi sifat daripada objek prototaip.

Function.prototype.call() dan Function.prototype.apply()

call() dan apply() boleh dianggap sebagai kaedah objek, dan fungsi dipanggil secara tidak langsung dengan memanggil kaedah. Parameter pertama mereka ialah objek induk bagi fungsi yang akan dipanggil, iaitu konteks panggilan, dan rujukan kepadanya diperoleh melalui ini dalam badan fungsi. Kaedah apply() mempunyai kesan yang sama seperti kaedah call(), kecuali kaedah pemindahan fungsi adalah berbeza Parameter sebenar semuanya diletakkan dalam tatasusunan.

Sebagai contoh, untuk memanggil fungsi f() sebagai kaedah objek o dan memasukkan dua parameter, anda boleh menggunakan kod seperti ini:

var o = {};

function f(a, b) {
 return a + b;
}

f.call(o, 1, 2);    // 将函数f作为o的方法，实际上就是重新设置函数f的上下文
f.apply(o, [1, 2]);

Beri contoh lain, gunakan kaedah panggilan untuk memanggil fungsi tanpa nama:

Dalam badan gelung for dalam contoh berikut, kami mencipta fungsi tanpa nama, dan kemudian melaksanakan fungsi tanpa nama dengan memanggil kaedah panggilan fungsi tersebut, menggunakan setiap elemen tatasusunan seperti yang dinyatakan nilai ini. Tujuan utama fungsi tanpa nama ini adalah untuk menambah kaedah cetakan pada setiap objek elemen tatasusunan ini boleh mencetak nombor indeks yang betul bagi setiap elemen dalam tatasusunan. Sudah tentu, ia tidak perlu untuk menghantar elemen tatasusunan ke dalam fungsi tanpa nama kerana nilai ini (parameter normal sudah mencukupi).

var animals = [
 {species: 'Lion', name: 'King'},
 {species: 'Whale', name: 'Fail'}
];

for (var i = 0; i < animals.length; i++) {
 (function (i) { 
  this.print = function () { 
   console.log('#' + i + ' ' + this.species + ': ' + this.name); 
  } 
  this.print();
 }).call(animals[i], i);
}

Function.prototype.bind()

bind() ialah kaedah baharu dalam ES5 Seperti yang dapat dilihat dari namanya, fungsi utama kaedah ini adalah untuk mengikat fungsi pada objek. Apabila memanggil kaedah bind() pada fungsi f() dan kemudian menghantar objek o sebagai parameter, kaedah ini akan mengembalikan fungsi baharu: (dalam bentuk panggilan fungsi) memanggil fungsi baharu akan menggantikan fungsi asal f () Dipanggil sebagai kaedah o. Contohnya:

function f(y) {
 return this.x + y;
}

var o = {
 x: 1
};

var g = f.bind(o); // 通过调用 g(x) 来调用 o.f(x)
g(2); // 3

Malah, kita boleh melaksanakan kaedah bind() dengan mudah:

// 返回一个函数，通过调用它来调用o中的方法f()，传递它所有的实参
function bind(f, o) {
 if (f.bind) return f.bind(o); // 如果bind()方法存在，使用bind()方法
 else return function () {
  return f.apply(o, arguments);
 }
}

二、函数式编程
JavaScript并非函数式编程语言，但在JavaScript中可以像操控对象一样操控函数，也就是说可以在JavaScript中应用函数式编程技术。

使用函数处理数组

假设有一个数组，数组元素都是数字，我们想要计算这些元素的平均值和标准差。

var data = [1, 1, 3, 5, 5];
var sum = function(x, y) {
 return x + y;
};
var square = function(x) {
 return x * x;
};

var mean = data.reduce(sum)/data.length;
var deviations = data.map(x => x - mean);

var stddev = Math.sqrt(deviations.map(square).reduce(sum)/(data.length - 1));
高阶函数

高阶函数就是操作函数的函数，它接收一个或多个函数作为参数，并返回一个新函数。举个例子：

function not(f) {
 return function () {
  var result = f.apply(this, arguments);
  return !result;
 };
}

// 判断x是否为偶数的函数
var even = function(x) {
 return x % 2 === 0;
};

var odd = not(even);      // 一个新函数，所做的事情和even()相反
[1, 1, 3, 5, 5].every(odd);   // true，每个函数都是奇数

函数not()是个高阶函数，因为它返回一个新的函数，这个新函数将它的实参传入f()，并返回f的返回值的逻辑非。

以上就是关于javascript的call()、apply()、bind()的用法，希望对大家的学习有所帮助。