相关知识来自于一道题:

使用ES6的箭头函数语法可以直接省略 functionreturn 关键字,比如 function (){return 1;} 就可以简化成 () => 1 , 但是如果需要返回对象时需要加一个括号,比如 () => ({a:1}), 因为JS解释器会误把大括号当作函数的起始符号,需要加上一个括号。那如果没有这个括号会怎么样呢?

() => {a:1} 会输出什么?还是说会报错?

不管怎么样,直接打开F12先试一下

const f = () => {a:1};
f(); // undefined

返回了undefined,说明代码是能跑的,那又为什么是undefined呢,a和1跑哪去了?

回头查了一下JS中关于冒号的作用,常用的有:

  1. ?:三元运算
  2. switch语句
  3. 对象字面量

另外还有一个不常用容易忘记的:

作为一个label标签,用于与 break 和 continue 配合,让语句跳转到指定的位置,类似 goto 的作用。直接放两个示例,很容易看出它的用途,虽然也不常这么用。

continue

a: for(let i = 0; i < 5; i++){
for(let j = 0; j < 5; j++){
if(j===2) continue a;
console.log(i,j);
}
}
/*
输出结果:
0 0,
0 1,
1 0,
1 1,
...
4 0,
4 1
*/

break

b: for(let i = 0; i < 5; i++){
for(let j = 0; j < 5; j++){
if(j===2) break b;
console.log(i,j);
}
}
/*
输出结果:
0 0,
0 1
*/

到这里就知道为什么返回undefined了,因为 {a:1} 中的 a:被当成了一个标签,就剩下一个1没有return语句。

除此之外,标签还可以换行写,所以 {a:1}就等于

{
a:
1
}

因此, () => {a:1,b:2} 是会报错的,因为等价于

{
a:
2,
b:
1
}

再由此可以推断出另一个东西 () => {a:b:c:d:1}不会报错而是返回undefined

总结

本文全来源于一道与JS语法相关的题目,虽然在开发过程中并没有什么卵用,但是说不定哪天面试就用上了呢?

最后祝大家五一快乐。

参考

js中冒号的作用

JavaScript权威指南(6th)

JS中的与冒号的作用、箭头函数相关的一道题的更多相关文章

  1. asp.net类似于js中的setTimeOut()的函数作用?

    asp.net类似于js中的setTimeOut()的函数作用? 插入这行即可,定时2秒,再运行下一步: System.Threading.Thread.Sleep(); 加个随机数 Random r ...

  2. c# 冒号:C#中两个冒号(::)的作用

    global::System.Console.WriteLine(number); 冒号在什么地方用. 点是空间下类,表示下一层的意思? 这里面::前面是GAC的标示符global,用法比较特殊,和. ...

  3. 在js中,window != top 的作用

    在网站的首页加上下面的javascript,就可以把自己的窗口变成是最前端的窗口.可以避免别人把你的网站放在他的iframe中,显示的就是他的网站了,误导浏览者. <script type=&q ...

  4. js中call和apply的作用和用法

    call和apply的用途是完全一样的.改变函数中this的指向: 为什么要改变this的指向呢?这个有什么用?有哪些场景呢? 首先this的指向总是在变的,this的指向是由函数执行时所在的环境决定 ...

  5. (三目运算符)PHP中问号?和冒号: 的作用

    <表达式1>?<表达式2>:<表达式3>; "?"运算符的含义是: 先求表达式1的值, 如果为真, 则执行表达式2,并返回表达式2的结果 ; 如 ...

  6. js中的throw err的作用

    1.阻止程序的运行 2.把错误消息打到控制台

  7. 【原创】js中利用cookie实现记住密码功能

    在登录界面添加记住密码功能,我首先想到的是在java后台中调用cookie存放账号密码,大致如下: HttpServletRequest request HttpServletResponse res ...

  8. JS中实现种子随机数

    参数: 详谈JS中实现种子随机数及作用 我在Egret里这么写... class NumberTool{ /**种子(任意默认值5)*/ public static seed:number = 5; ...

  9. js中$

    $符号在php中是表示变量的特征字符, 在js中它也有很多作用, 一般我们用来命名一个函数名称,获取id的1.首先可以用来表示变量, 比如变量 var s='asdsd'或var $s='asdasd ...

随机推荐

  1. WSDL详解(一)

    WSDL文档使用web服务描述语言来定义服务. 文档包括逻辑(抽象)部分和具体部分. 抽象部分用于定义独立于实现的数据类型和消息,具体部分定义一个endpoint如何实现一个可以与外界进行交互的服务. ...

  2. webpack学习笔记(2)--webpack.config.js

    3 模式 mode mode 参数设置为 development(开发模式), production(生产模式) 或 none(无),可以启用对应环境下 webpack 内置的优化.默认值为 prod ...

  3. nyoj28-大数阶乘

    大数阶乘 时间限制:3000 ms  |  内存限制:65535 KB 难度:3 描述 我们都知道如何计算一个数的阶乘,可是,如果这个数很大呢,我们该如何去计算它并输出它? 输入 输入一个整数m(0& ...

  4. 如何指定GCC的默认头文件路径

    如何指定GCC的默认头文件路径 网上偶搜得之,以之为宝:)原地址:http://blog.chinaunix.net/u/28781/showart.php?id=401631============ ...

  5. Python编程:从入门到实践 - matplotlib篇 - plot & scatter

    matplotlib篇 plot & scatter # filename.py 获取当前文件名方法 import sys # 当前文件名 print(sys.argv[0]) # 去除后缀后 ...

  6. chckBox样式的修改

    在Android开发中,系统自带的默认CheckBox由于比较简陋,可能难以满足部分人的审美需求,不过,Android具有很强的扩展性,自定义CheckBox其实也很简单. 1. Layout中定义C ...

  7. 利用LoadRunner来进行文件下载的测试

    小强创立的“三级火箭”学习方式 1.参加培训班,即报名缴纳学费后,拉入专属QQ群,由老师亲自上课进行讲解,课后仍提供视频 性能测试培训班招生中,报名与咨询QQ:2083503238 python自动化 ...

  8. System v shm的key

    shmget函数用于创建或打开一个共享内存区对象,shmget成功调用会返回一个共享内存区的标识符,供其它的共享内存区操作函数使用. key:用于创建共享内存区的键值,这个在前面其他System IP ...

  9. NOIP2012 同余方程 题解

    描写叙述 求关于x的同余方程ax ≡ 1 (mod b)的最小正整数解. 格式 输入格式 输入仅仅有一行,包括两个正整数a, b,用一个空格隔开. 输出格式 输出仅仅有一行,包括一个正整数x0.即最小 ...

  10. 利用ajax异步处理POST表单中的数据

    //防止页面进行跳转 $(document).ready(function(){   $("#submit").click(function(){    var str_data= ...