Question

在ES6之前，没有相应的提取数据的机制。这就是解构 - 它可以让你提取多个属性通过对象模式从对象。例如，在左侧任务的一面：

const { first: f, last: l } = obj;

我理解下面的示例，例如，可以将createServer模块中的http方法分配给同名变量。

const { createServer } = require('http');

但是这个怎么样：

const { parse: parseUrl } = require('url');

您如何在代码中使用它？

Answer 1

如果要更改来自$numbersArr = array(3,5,17,19,24,30,38,47,52); $userInput = 35; if (in_array($userInput, $numbersArr)){ echo 'found needle'; }else{ for ($loop = $userInput;$loop < 9999999; $loop++) { if (in_array($loop,$numbersArr)){ echo 'found needle'; break; } } // end of for loop }

的变量的名称，请使用此选项

因为require（'url'）包含require('url')，但是假设您当前范围内已经有一个名为parse的变量，并且您想要parse来自parse在这种情况下，您可以使用此模式将其重命名为require('url')

示例：

parseUrl

Answer 2

它只是提取parse数据并在此范围内创建parseUrl变量。

当（假设）您使用API并希望使用变量而不是成员访问时，这非常方便：

const {id: serviceID} = await fetchDefaultService();
const {id: uid} = await fetchUser(serviceID, uid);

它只是允许控制命名（parseUrl具有比parse更多的含义），并允许您避免潜在的冲突。

Answer 3

示例中的行从parse模块中剥离url函数，并将其重命名为parseUrl。您可以像这样使用它：

> const { parse: parseUrl } = require('url')
undefined
> parseUrl('http://stackoverflow.com/')
Url {
  protocol: 'http:',
  slashes: true,
  auth: null,
  host: 'stackoverflow.com',
  port: null,
  hostname: 'stackoverflow.com',
  hash: null,
  search: null,
  query: null,
  pathname: '/',
  path: '/',
  href: 'http://stackoverflow.com/' }

这只是从node代表复制/粘贴。打开终端，输入命令node，然后交互式输入js并测试发生的情况。

Answer 4

Destructuring是一个很棒的功能，可以帮助您轻松地从数组超级中提取对象属性或元素让我们通过例子来理解它

在第一个例子中因为obj有一个名为name的prop我们可以从中提取它
所以如果对象有道具，我们可以提取它。
＆＃13;
＆＃13;
```
let obj = {
  name :'maged' 
}
let {name} = obj ;  // have this prop 
let {fullName} = obj ; // don't have this prop 
console.log(name) ; // maged  
console.log(fullName) ;  // undefined 
```
＆＃13;
＆＃13;
＆＃13;
- 在这个例子中，我们将一个对象从一个函数返回到 require_s 中的 require 函数，该函数返回导出对象

＆＃13;

function require(module) {
  return {
      name : module ,
      method1: '1' ,
      method2 : '2'
   }
}
let obj =  require('url') ; 
let {name,method1,method2} = obj ; 
console.log(name) ; // url 
console.log(method1) ; // 1 
console.log(method2) ;  // 2

＆＃13;

如您所见，我们可以轻松地从返回的对象中提取多个属性
在我们的第三个例子中，我们将看到如何将prop提取到一个新的变量名称

＆＃13;

let obj = {
  a :'a' ,
  b:'b' 
}
let {a:first , b:second} = obj ;
console.log(first) ; // a 
console.log(second) // b
console.log(a); // Uncaught ReferenceError: a is not defined

＆＃13;

正如您所看到的，我们将属性提取为新的变量名称，这很好，

现在到最后一个例子，我们将看到如果在变量中存在默认值，如果该变量在传递给函数时对于默认对象属性这样的东西是有用的，那么该变量将被赋予该变量

＆＃13;

let obj = {
  fullName : 'Sniper' 
}
let {fullName='super'} = obj ; // sniper from the obj 
console.log(fullName) ; 
let {name='maged'} = obj ; // maged because undefined in the obj 
console.log(name) ;

＆＃13;

我希望这些例子能够帮助您理解解构及其工作方式

注意解构适用于数组

在JavaScript中，解构分配模式似乎并不清晰

4 个答案: