Question

我正在阅读有关可观察对象的角度文档，并且遇到了这种语法。

const locations = new Observable((observer) => {

  const {next, error} = observer; 

  //...
}

const {next, error} = observer;正在执行哪种类型的分配？

我以前没看过这个。谁能给我正确的术语或发生的事情的明细？

Answer 1

这是销毁对象的方法，因此与

let next = observer.next
let error    = observer.error

您还可以使用以下列表进行操作：

let [x, y] = ['a', 'b']; // x = 'a', y = 'b'

，您可以重命名变量名称，例如：

let {length : len} = 'abc'; // len = 3

还有更多示例here

Answer 2

它叫Destructuring Assignment。

对于对象，您已经注意到，键是变量的名称。请注意，这也适用于导入：

// my-export.ts

export class MyClass { //... }

// my-import.ts

import { MyClass } from './my-export.ts'

这对于丢弃死依赖的摇晃编译器特别有用。

您还可以指定应从中获取变量值的键：

const one = { id: 1 };
const two = { id: 2 };

const { id: first } = one;
const { id: second } = two;

console.log(first); // 1
console.log(second); // 2

您还可以在阵列上使用销毁分配：

const myArray = [1,2,3,4,5];
const [foo, bar] = myArray;
console.log(`${foo}, ${bar}`); // "1, 2"

您可以跳过数组中的元素：

const [,,bat] = myArray;
console.log(bat); // "3"

您还可以将数组元素的“其余”分配给变量：

const [first, ...rest] = myArray;
console.log(rest); // "[2,3,4,5]"

那只是冰山一角！查看我链接的文章以获取完整图片。

Answer 3

这是解构ES6语法的一部分，但是首先要知道的是Angular中的Observable是什么？一个Observable只是一个函数，其特征之一是它包含observer。

什么是observer？ observer是具有next，error和complete方法的对象。

因此，假设observer对象看起来像这样：

var observer = {
  next: 'You can move on now',
  error: 'Sorry, you messed up',
  complete: 'All done!'
};

//var next = observer.next;
// var error = observer.error;

const { next, error } = observer;
next;
error;

因此，已注释掉了ES5版本，它下面的ES6与Angular文档中看到的const { next, error } = observer;的上面版本和另一个版本等效。

这是一种提取此observer对象所需的属性的方法，在这种情况下，next和error回调仅在用户订阅时传递。实际上，在这个observer对象中，它们是比属性更多的方法，但是为了使课程更加生动，我将使用属性简化它。

所以他们也可以做const { next, error, complete } = observer，但是显然他们不需要complete方法。因此，为避免重复的代码并从对象中提取属性或方法，如在文档中所见，将行合并在一起，然后，如果需要调用这些属性，则可以这样做：

const { next, error } = observer;
next;
error;

无需使用ES5点表示法。

如果您尝试提取next，error或complete以外的任何内容，则由于这些属性或在observer的情况下，方法会导致未定义observer对象中不存在。

什么是“ const {next，error} =观察者”语法？

3 个答案: