Javascript 为什么箭头函数的隐含“return”不';在这种情况下不起作用(TS)?

Javascript 为什么箭头函数的隐含“return”不';在这种情况下不起作用(TS)?,javascript,typescript,arrow-functions,Javascript,Typescript,Arrow Functions,更新: 在这一点上,我再也无法在本地重新编程,在我运行之后 rm -rf node_mdoules/ && npm i 我将保留这个问题,因为它可能对其他遇到此错误的人有用。在撰写本文时,该缺陷仍然可以在中重现 如果有人找到一种可靠的方法来重新编写它,就一定要提供一份回购协议,因为我知道,一些充满激情的程序员非常好奇地寻找它的根本原因 初始问题 我有一个JavaScript代码,它可以工作: const iconsMap=新映射([ [“屋顶”,“屋顶”], [“墙”,“墙”

更新:

在这一点上,我再也无法在本地重新编程,在我运行之后

rm -rf node_mdoules/ && npm i
我将保留这个问题,因为它可能对其他遇到此错误的人有用。在撰写本文时,该缺陷仍然可以在中重现

如果有人找到一种可靠的方法来重新编写它,就一定要提供一份回购协议,因为我知道,一些充满激情的程序员非常好奇地寻找它的根本原因


初始问题

我有一个JavaScript代码,它可以工作:

const iconsMap=新映射([
[“屋顶”,“屋顶”],
[“墙”,“墙”],
[“门窗”、“门”],
[“加热和控制”、“加热”],
[“通风与气密性”、“通风”],
[“可再生能源”,“可再生能源”],
[“其他”、“其他”],
['Default','home'],
]);
console.log(
Object.assign({}
);
我的第一次Typescript尝试非常接近原始JS:

const iconsMap:Map=新映射([
[“屋顶”,“屋顶”],
[“墙”,“墙”],
[“门窗”、“门”],
[“加热和控制”、“加热”],
[“通风与气密性”、“通风”],
[“可再生能源”,“可再生能源”],
[“其他”、“其他”],
['Default','home'],
]);
接口字典{
[键:字符串]:T;
}
console.log(
Object.assign(
{}作为字典,
…数组.from(iconsMap).map(
([label,fileName])=>({[label]:fileName})
)
)
);
但它与:

VM325:13未捕获的语法错误:意外标记“(” 在新函数()处 at exec(VM319 typescript.js:41)

由于某种原因,箭头函数
()=>({})的隐含
返回
在这里失败。我需要执行
()=>{return{};}
。因此,此操作有效:

console.log(
  Object.assign(
    {} as Dictionary<string>,
    ...Array.from(iconsMap).map(([label, fileName]) => {
      return { [label]: fileName };
    })
  )
);
但是我想理解为什么上面隐含的
返回失败


感谢您抽出时间。

您编译的代码

更多
对于任何有效的JavaScript语法,只要将其复制粘贴到TypeScript文件中,就永远不会得到语法错误。因为您的TypeScript代码是有效的,并且正确地传输到JS,至少在TS 3.9.2中是如此。这似乎是一个JSFIDLE错误或TS错误。它们在您链接的JSFIDLE中使用TS 1.7.3,您可以通过执行ts.version

我在他们用来将TS传输到JS的脚本中添加了一个日志断点,如下所示:

var transpiled = ts.transpile.apply(ts, [param[0], param[1], "filename", diagnostics]);
new Function(transpiled)();
记录
transpiled
变量显示代码已转换为:

var iconsMap = new Map([
    ['Roofs', 'roofs'],
    ['Walls', 'walls'],
    ['Windows & Doors', 'doors'],
    ['Heating & Controls', 'heating'],
    ['Ventilation & Air Tightness', 'ventilation'],
    ['Renewables', 'renewables'],
    ['Others', 'others'],
    ['Default', 'home'],
]);
console.log(Object.assign({}, ...Array.from(iconsMap).map(function ([label, fileName]) ({ [label]: fileName }))));
请注意,arrow函数已转换为:

function ([label, fileName]) ({ [label]: fileName })))

当然,这是无效的。我建议您在vscode或
ts节点中使用类似Quokka的东西,如果您希望一些本地游乐场在不需要设置东西的情况下尝试一些东西,但您至少可以控制您尝试的ts版本。

typescript.js是什么意思(可能是编译后的结果?)包含?它看起来是这样的:
console.log(Object.assign({},…Array.from(iconsMap).map(function([label,fileName])({[label]:fileName})));
。(另外,您使用的是哪一版本的Node,并且您确定TypeScript编译步骤成功了吗?TypeScript成功编译为语法无效的JavaScript将非常奇怪。)您能否确保您使用的是最新版本的TypeScript编译器,并升级到支持的Node(14)版本?我发现TypeScript JSFIDLE的版本正在使用:1.7.3,非常过时(仍然不是我期望的稳定版本的那种错误,但是…)。您是否调用tsc(就像您尝试的
tsc--version
)编译或使用其他工具?这就是我的想法,这就是为什么我惊讶地看到它失败的原因。然而,这并不能回答我的问题。它在链接的小提琴中失败了吗?如果是,你能解释一下原因吗?@tao我最初的解释是,你可能使用的是一个旧版本的TypeScript,它不包含支持ECMAScript 2017+语言功能。您需要从命令行运行
tsc
(而不是从编辑器或IDE中运行,因为这可能使用的是
tsc
的私有实例,其版本号与
路径中的
tsc
版本不同)看看它是否在那里工作——如果没有,tsc--version
会说什么?
version 3.9.6
这是在一个Vue项目中。我没有玩过配置(webpack、babel或ts),所以它有“最新的”(大约1个月前)转换插件,我希望它能工作。作为记录,编译器选项说:
目标:“esnext”,模块:“esnext”,…,库:[“esnext”、“dom”、“dom.iterable”、“scripthost”]
@tao:哪种转换插件?欢迎来到,Eddy,谢谢你花时间回答。我担心你的回答不会带来任何新的东西。它所陈述的一切都已经在下面的问题讨论或之前的“回答”中概述了(这和你的一样,并没有回答真正的问题:根本原因是什么?)。此外,我使用的不是VSCode,而是基于IntelliJ的IDE(带有强大的Typescript工具)。