🎖️请尽量不要使用箭头函数

简介: 箭头函数通常允许编写更为简洁的代码。有时,在需要处理"this"的情况下,使用箭头函数是有充分理由的。然而,通常情况下,它们可能更难以阅读。那么,什么时候应该使用箭头函数呢?

嗨,大家好!这里是道长王jj~ 🎩🧙‍♂️

箭头函数通常允许编写更为简洁的代码。

有时,在需要处理"this"的情况下,使用箭头函数是有充分理由的。

然而,通常情况下,它们可能更难以阅读。

那么,什么时候应该使用箭头函数呢?

在 JavaScript 中,我们有多种方式来编写函数:

hello = function() {
    // 常规函数
  return "Hello World!"
}
const hello = () => {
    // "箭头"函数
  return "Hello World!"
}
// 带隐式返回的箭头函数
const hello = () => "Hello World!"

特别是最后一个版本使用隐式返回来缩短表达式,如果将箭头函数与三元运算符结合起来,可以获得一些不错的效果:

// 常规函数
function getcolor(flag) 
{
   
    if (flag)
        return "green"
    else
        return "red"
}

// 箭头函数
const getcolor = (flag) => flag ? "green" : "red"

尽管周围的圆括号()并不是必需的,但在箭头函数的参数周围放置它们是一个很好的约定。在这种情况下,箭头函数可以带来最大的好处。代码更加简洁而且清晰。但是要小心不要过度使用!

const decode = c => 
   (Array.isArray(c)) ? c.map(el => (el > 0 ? el : -el)) : (c > 0 ? c : -c)

就比如以上这段代码,它可以工作,但是它做了什么呢?

我经常花费数小时来弄清楚一行代码的功能……

保持简洁性

我想呼吁大家尽量编写可读的代码!计算机只会按照代码的指示执行,但是程序员需要维护这些代码。

编写可读的代码可以节省你的时间,并且让你的工作更轻松。

对于仅仅返回一个值的简短函数,箭头函数提供了一种选项,可以编写更为紧凑的代码。

但是下面的示例表明,箭头函数 => 并不总是更简短:

 function f(a, b) {
    ... }
 const f = (a, b) => {
    ... }

即使箭头函数可以节省一些字节,为了可读性,您应该尽可能选择旧的 "function()" 语法!


🎉 你觉得怎么样?这篇文章可以给你带来帮助吗?当你处于这个阶段时,你发现什么对你帮助最大?如果你有任何疑问或者想进一步讨论相关话题,请随时发表评论分享您的想法,让其他人从中受益。🚀✨

目录
相关文章
|
7月前
|
自然语言处理 JavaScript 前端开发
说说箭头函数的特点
说说箭头函数的特点
78 0
|
7月前
|
开发者
箭头函数
认识箭头函数
63 4
|
7月前
箭头函数是什么
箭头函数是什么
57 0
|
7月前
|
JavaScript 前端开发 开发者
箭头函数的意义和函数的二义性
这篇文章介绍了箭头函数的特点以及与普通函数的区别。它指出了箭头函数没有this、arguments对象和prototype原型的特点,因此不能作为构造函数使用。文章还解释了函数的二义性问题,即函数可以有多种调用方式,这在JS设计上存在缺陷。最后,文章指出箭头函数不再依赖面向对象的概念,因此没有this和原型的概念。
|
7月前
箭头函数需要注意的地方
箭头函数需要注意的地方
32 1
|
7月前
|
JavaScript 网络架构
箭头函数详解
箭头函数详解
36 1
面试官:箭头函数和普通函数的区别?箭头函数的this指向哪里?(二)
面试官:箭头函数和普通函数的区别?箭头函数的this指向哪里?(二)
普通函数中的this指向问题解决方案箭头函数
普通函数中的this指向问题解决方案箭头函数
45 0
|
7月前
|
自然语言处理 前端开发 算法
箭头函数与普通函数:谁更胜一筹?
箭头函数与普通函数:谁更胜一筹?
箭头函数与普通函数:谁更胜一筹?
|
JavaScript 前端开发
箭头函数与this指向探究
箭头函数与this指向探究
39 1