为什么数组元素传递给 .then() 在 Typescript 中可以通过名称访问？

Question

我已经开始将我们的 ArcGis JS 模板集成到我们正在使用的 webpack 构建管道中。

为了实现这一点，我们需要稍微重构一下，并且需要开始使用 Esri-Loader (https://github.com/Esri/esri-loader)，它基本上将 dojos require 函数包装到一个 promise 中。

一个非常简单的示例如下所示：

start = () => {
    return EsriLoader.loadModules(['esri/Map', 'esri/views/MapView', "esri/Basemap"])
        .then(([Map, MapView, Basemap]) => {
            const map = new Map({
                basemap: "streets"
              });

              const view = new MapView({
                map: map,
                container: "map"
              });
        });
}

起初我尝试像这样编写对 .then() 的调用：.then((Map, MapView, Basemap) => { ... }，但收到以下编译器错误：

Argument of type '(Map: any, MapView: any, Basemap: any) => void' is not assignable to parameter of type '(value: any[]) => void | PromiseLike'.

好的，所以签名没有加起来：

function loadModules(modules: string[], loadScriptOptions?: ILoadScriptOptions): Promise<any[]>;

所以正确的做法是像上面这样：.then(([Map, MapView, Basemap]) => { ... }

至此我的理解已经到了极限。在下面的方法主体中，我可以通过它们的名称调用 Map、MapView 和 BaseMap，而我希望这是一个数组，我必须访问它 javascript-ish 像 Arguments[0][0]、Arguments[0][1] 等等，因为我只传入了一个 Array<any>.

类型的对象

请向我解释为什么以及如何做到这一点，或者如果我在这里做错了什么。

Answer 1

这叫做解构。

let [a, b, c] = result;

与

相同

let a = result[0];
let b = result[1];
let c = result[2];

函数参数也是如此

function ([a,b,c]) {
}

与

相同

function (args) {
  let a = args[0];
  let b = args[1];
  let c = args[2];
}

你也可以进行对象解构：

let { a, b, c } = item;

同于：

let a = item.a;
let b = item.b;
let c = item.c;

在你的例子中，代码可以写成：

start = () => {
    return EsriLoader.loadModules(['esri/Map', 'esri/views/MapView', "esri/Basemap"])
        .then(modules => {
            const Map = modules[0];
            const MapView = modules[1];
            const Basemap = modules[2];
            const map = new Map({
                basemap: "streets"
              });

              const view = new MapView({
                map: map,
                container: "map"
              });
        });
}

为什么数组元素传递给 .then() 在 Typescript 中可以通过名称访问？

Why are array elements passed into .then() accessible by name in Typescript?

typescript

promise

arcgis-js-api

esri-loader