Rumah hujung hadapan web tutorial js Javascript中 带名 匿名 箭头函数的重要区别(推荐)

Javascript中 带名 匿名 箭头函数的重要区别(推荐)

Feb 03, 2017 pm 01:57 PM

带名函数是指函数显示地给出了一个名字的函数,function abs(x){}。匿名函数是指函数只带有function这个关键字,而没有像abs这种函数名称的函数,如function(){}。ES6标准新增了一种新的函数:Arrow Function(箭头函数)箭头函数表面上相当于匿名函数,并且简化了函数定义。它们各自的区别是什么呢?

1 带名和匿名函数的区别

区别:匿名函数需要讲地址赋值给另一个变量let a,然后再用a来调用函数;而带名函数因为显示地给出了函数名称,所以可以直接用这个函数名称调用。

带名函数返回值是函数体内的返回值,如abs(x)函数的返回值是number变量。函数调用时,直接abs(6)调用,这个非常好理解。

function abs(x){
 if(x>=0){
  return x;
 }else{
  return -x;
 }
}
Salin selepas log masuk

但是匿名函数呢?如下所示,函数未显示地给出一个函数名称,但是此处的abs被赋值为这个匿名函数的地址,所以使用时可以直接用abs(-3),诸如此类的调用。

let abs=function(x){
 if(x>=0){
  return x;
 }else{
  return -x;
 }
}
Salin selepas log masuk

2 箭头函数

ES6标准新增了一种新的函数:Arrow Function(箭头函数)。为什么叫Arrow Function?因为它的定义用的就是一个箭头。箭头函数表面上相当于匿名函数,并且简化了函数定义。

箭头函数有两种格式,一种是只包含一个表达式,连{ … }和return都省略掉了。

x => x * x
Salin selepas log masuk

上面的箭头函数相当于一个匿名函数“”

function (x) {
 return x * x;
}
Salin selepas log masuk

还有一种可以包含多条语句,这时候就不能省略{ … }和return:

(x,y) => {
 if (x > 0) {
  return x + y;
 }
 else {
  return -x + y;
 }
}
Salin selepas log masuk

3 箭头函数和匿名函数的不同

箭头函数看上去是匿名函数的一种简写,但实际上,箭头函数和匿名函数有个明显的区别:箭头函数内部的this是词法作用域,由上下文确定。

调用函数obj1.getAge(2017)和调用obj2.getAge(2017)会得到相同的结果吗?

obj1中fn函数,由于JavaScript函数对this绑定的错误处理,得不到预期的结果,this.birth指向window或undefined。

但是obj2,fn函数是箭头函数,箭头函数完全修复了this的指向,this总是指向词法作用域,也就是外层调用者obj2。

var obj1 = {
 birth: 1990,
 getAge: function (year) {
  let fn=function(y){
   return y - this.birth; // this指向window或undefined
  };
  return fn(year);
 }
};
var obj2 = {
 birth: 1990,
 getAge: function (year) {
  var fn = (y) => y - this.birth; // this.birth为1990
  return fn(year);
 }
};
Salin selepas log masuk

   

4 总结

和带名函数相比,匿名函数需要讲地址赋值给另一个变量let a,然后再用a来调用函数;和匿名函数比,箭头函数完全修复了this的指向,this总是指向词法作用域。

以上所述是小编给大家介绍的Javascript中 带名 匿名 箭头函数的重要区别,希望对大家有所帮助,如果有任何疑问欢迎给我留言,小编会及时回复大家的!

更多Javascript中 带名 匿名 箭头函数的重要区别(推荐)相关文章请关注PHP中文网!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Apa yang perlu saya lakukan jika saya menghadapi percetakan kod yang dihiasi untuk resit kertas terma depan? Apa yang perlu saya lakukan jika saya menghadapi percetakan kod yang dihiasi untuk resit kertas terma depan? Apr 04, 2025 pm 02:42 PM

Soalan dan penyelesaian yang sering ditanya untuk percetakan tiket kertas terma depan dalam pembangunan front-end, percetakan tiket adalah keperluan umum. Walau bagaimanapun, banyak pemaju sedang melaksanakan ...

Siapa yang dibayar lebih banyak Python atau JavaScript? Siapa yang dibayar lebih banyak Python atau JavaScript? Apr 04, 2025 am 12:09 AM

Tidak ada gaji mutlak untuk pemaju Python dan JavaScript, bergantung kepada kemahiran dan keperluan industri. 1. Python boleh dibayar lebih banyak dalam sains data dan pembelajaran mesin. 2. JavaScript mempunyai permintaan yang besar dalam perkembangan depan dan stack penuh, dan gajinya juga cukup besar. 3. Faktor mempengaruhi termasuk pengalaman, lokasi geografi, saiz syarikat dan kemahiran khusus.

Demystifying JavaScript: Apa yang berlaku dan mengapa penting Demystifying JavaScript: Apa yang berlaku dan mengapa penting Apr 09, 2025 am 12:07 AM

JavaScript adalah asas kepada pembangunan web moden, dan fungsi utamanya termasuk pengaturcaraan yang didorong oleh peristiwa, penjanaan kandungan dinamik dan pengaturcaraan tak segerak. 1) Pengaturcaraan yang didorong oleh peristiwa membolehkan laman web berubah secara dinamik mengikut operasi pengguna. 2) Penjanaan kandungan dinamik membolehkan kandungan halaman diselaraskan mengikut syarat. 3) Pengaturcaraan Asynchronous memastikan bahawa antara muka pengguna tidak disekat. JavaScript digunakan secara meluas dalam interaksi web, aplikasi satu halaman dan pembangunan sisi pelayan, sangat meningkatkan fleksibiliti pengalaman pengguna dan pembangunan silang platform.

Bagaimana untuk menggabungkan elemen array dengan ID yang sama ke dalam satu objek menggunakan JavaScript? Bagaimana untuk menggabungkan elemen array dengan ID yang sama ke dalam satu objek menggunakan JavaScript? Apr 04, 2025 pm 05:09 PM

Bagaimana cara menggabungkan elemen array dengan ID yang sama ke dalam satu objek dalam JavaScript? Semasa memproses data, kita sering menghadapi keperluan untuk mempunyai id yang sama ...

Bagaimana untuk mencapai kesan menatal paralaks dan kesan animasi elemen, seperti laman web rasmi Shiseido?
atau:
Bagaimanakah kita dapat mencapai kesan animasi yang disertai dengan menatal halaman seperti laman web rasmi Shiseido? Bagaimana untuk mencapai kesan menatal paralaks dan kesan animasi elemen, seperti laman web rasmi Shiseido? atau: Bagaimanakah kita dapat mencapai kesan animasi yang disertai dengan menatal halaman seperti laman web rasmi Shiseido? Apr 04, 2025 pm 05:36 PM

Perbincangan mengenai realisasi kesan animasi tatal dan elemen Parallax dalam artikel ini akan meneroka bagaimana untuk mencapai yang serupa dengan laman web rasmi Shiseido (https://www.shiseido.co.jp/sb/wonderland/) ... ...

Perbezaan dalam Konsol.Log Output Result: Mengapa kedua -dua panggilan berbeza? Perbezaan dalam Konsol.Log Output Result: Mengapa kedua -dua panggilan berbeza? Apr 04, 2025 pm 05:12 PM

Perbincangan mendalam mengenai punca-punca utama perbezaan dalam output konsol.log. Artikel ini akan menganalisis perbezaan hasil output fungsi Console.log dalam sekeping kod dan menerangkan sebab -sebab di belakangnya. � ...

Adakah JavaScript sukar belajar? Adakah JavaScript sukar belajar? Apr 03, 2025 am 12:20 AM

Pembelajaran JavaScript tidak sukar, tetapi ia mencabar. 1) Memahami konsep asas seperti pembolehubah, jenis data, fungsi, dan sebagainya. 2) Pengaturcaraan asynchronous tuan dan melaksanakannya melalui gelung acara. 3) Gunakan operasi DOM dan berjanji untuk mengendalikan permintaan tak segerak. 4) Elakkan kesilapan biasa dan gunakan teknik debugging. 5) Mengoptimumkan prestasi dan mengikuti amalan terbaik.

Bagaimana untuk melaksanakan fungsi seretan panel dan drop pelarasan yang serupa dengan vscode dalam pembangunan front-end? Bagaimana untuk melaksanakan fungsi seretan panel dan drop pelarasan yang serupa dengan vscode dalam pembangunan front-end? Apr 04, 2025 pm 02:06 PM

Terokai pelaksanaan fungsi seretan panel dan drop panel seperti VSCode di bahagian depan. Dalam pembangunan front-end, bagaimana untuk melaksanakan vscode seperti ...

See all articles