JavaScript模式:这是为数组分配多个值的有效方法吗?

JavaScript Pattern: Is this a valid way of assigning multiple values to an array?

本文关键字:有效 方法 分配 模式 数组 JavaScript      更新时间:2023-09-26

我在CodeReview上看到过这种模式:https://codereview.stackexchange.com/questions/144954/generate-a-table-with-random-numbers

最后一个函数"shuffeledArray"。

下面的代码用于在一次操作中为数组赋多个值:

var demo = [];
[demo[0], demo[1], demo[2]] = [2, 4, 8];
console.log(demo);

它的工作原理。

但我问自己:

应该使用这些技术吗?还是有缺点?

这只是一个很差的例子:解构赋值。

一个更好的例子使析构赋值的有用性更加明显。考虑一个函数需要返回多个返回值的情况。通常,返回一个对象或数组。通过解构赋值,可以使用单个变量来消费返回值:

作为对象:

function minMax(a) {
  let min = a[0], max = a[0];
  a.forEach(entry => {
    if (min > entry) {
      min = entry;
    }
    if (max < entry) {
      max = entry;
    }
  });
  return {min, max};
}
let {min, max} = minMax([2, 4, 8]);
console.log(min, max);

作为数组:

function minMax(a) {
  let min = a[0], max = a[0];
  a.forEach(entry => {
    if (min > entry) {
      min = entry;
    }
    if (max < entry) {
      max = entry;
    }
  });
  return [min, max];
}
let [min, max] = minMax([2, 4, 8]);
console.log(min, max);

使用对象进行解构尤其有用,例如,在处理模块时。假设一个模块导出了一大堆东西,其中你只需要foobar:
import {foo, bar} from "./module";

关于不使用它的浏览器支持参数:这就是编译的目的。在IE9的两年多时间里(是的,在规范最终确定之前),由于编译,我一直很高兴地在浏览器项目中使用ES2015。

语法是ES6并且完全有效,为了使其与现有浏览器兼容,您可能需要使用babel或跟踪器来编译您的ES6 code to ES5 code to run in browser.

var [a, b] = [1, 2];
console.log(a, b);

上面的代码可以将1和2分别赋值给a和b。

var [a, ...b] = [1, 2, 3];
console.log(a, b);

在上面的代码中,我们使用扩展运算符给a = 1b = [2,3]赋值

关于Array destructing.的更多主题

http://www.2ality.com/2015/01/es6-destructuring.html