javascript - 为什么在这里使用解构?
问题描述
我在 The Odin Project 上问了这个问题,我遇到了这个问题,并被引导研究解构,我做到了。我了解正在发生的事情,但我不知道为什么要这样做。简单地使用没有解构大括号的原始变量名称会得到相同的结果(请参阅我的 jfiddle 链接,其中我删除了解构并得到相同的结果)。当我被要求使用更多的代码、打字和复杂性来达到相同的结果时,我发现很难学到东西。通过return {sayName}
在 const Person 和const {sayName} = Person(name)
const Nerd 中使用可以得到什么好处?我在 jfiddle 中使用return sayName
and并得到了相同的结果。const sayName
原始代码:
const Person = (name) => {
const sayName = () => console.log(`my name is ${name}`)
return {sayName}
}
const Nerd = (name) => {
// simply create a person and pull out the sayName function with destructuring assignment syntax!
const {sayName} = Person(name)
const doSomethingNerdy = () => console.log('nerd stuff')
return {sayName, doSomethingNerdy}
}
const jeff = Nerd('jeff')
jeff.sayName() //my name is jeff
jeff.doSomethingNerdy() // nerd stuff
const Person = (name) => {
const sayName = () => console.log(`my name is ${name}`)
return sayName
}
const Nerd = (name) => {
// simply create a person and pull out the sayName function with destructuring assignment syntax!
const sayName = Person(name)
const doSomethingNerdy = () => console.log('nerd stuff')
return {sayName, doSomethingNerdy}
}
const jeff = Nerd('jeff')
jeff.sayName() //my name is jeff
jeff.doSomethingNerdy() // nerd stuff
解决方案
普遍的共识是,这是解构的一个坏例子,但我已经走得太深了,仍然会尝试理解它。
通过使用解构,可以向Person
.
例如,Person 需要跳转:
const Person = (name) => {
const sayName = () => console.log(`my name is ${name}`)
const jump = () => console.log('I jumped') // new feature
return {sayName, jump} // jump can inserted into the object here and used externally
}
然后,正如评论中所指出的,将 Person 传递给 Nerd 的更好方法是:
const Nerd = (name) => {
// simply create a person and pull out the sayName function with destructuring assignment syntax!
const doSomethingNerdy = () => console.log('nerd stuff')
return {...Person(name) , doSomethingNerdy}
}
在finally之前可以解构Nerd,Person和Nerd里面的所有功能都可以使用。
我想这就是他们想要达到的目的。
推荐阅读
- php - microtime() 函数是计算 CPU 在整个 php 脚本上花费的时间的可靠方法吗?
- html - 具有相同大小的按钮和 div 在 em 中不相等,而在 px 中相等
- javascript - jQgrid列过滤在单列中不起作用
- php - Wordpress 不阅读样式表
- c++ - 从 std::exception 派生的类的赋值运算符
- java - 如何在java中检查两个双精度数是否相等
- java - Apache James 无法读取 JAVA_HOME
- javascript - 如何将本地文件夹中的背景图像添加到容器中
- minecraft - 获取 Minecraft 中所有项目的图像
- c# - Word open xml的富文本内容控件中的新行