JavaScript:通过计算的键动态解构对象
JavaScript中的解构赋值是一种通过计算的键动态解构对象的方法。它允许我们从对象中提取属性值并将它们赋值给变量。
解构赋值的语法如下：
const { 属性名 } = 对象;其中，属性名是要提取的属性名，对象是要解构的对象。
解构赋值的优势在于可以简化代码，使得从对象中提取属性值变得更加方便和直观。它可以用于处理函数的返回值、遍历数组和对象等场景。
以下是解构赋值的一些应用场景：
- 从函数返回值中提取属性值：
function getUser() {
return {
name: 'John',
age: 30,
email: 'john@example.com'
};
}
const { name, age, email } = getUser();
console.log(name); // 输出: John
console.log(age); // 输出: 30
console.log(email); // 输出: john@example.com- 遍历数组：
const numbers = [1, 2, 3, 4, 5];
for (const number of numbers) {
console.log(number);
}- 遍历对象的属性：
const user = {
name: 'John',
age: 30,
email: 'john@example.com'
};
for (const [key, value] of Object.entries(user)) {
console.log(`${key}: ${value}`);
}腾讯云提供了一系列与JavaScript开发相关的产品和服务，例如云函数（Serverless）、云开发（CloudBase）、云存储（COS）等。您可以通过访问腾讯云官方网站（https://cloud.tencent.com/）了解更多相关信息。
相关·内容
我一直在寻找一个只使用JavaScript的Lodash omit()的替代品。这就是我想要实现的：
function omit(obj, attr) {
// @obj: original object
// @attr: string, attribute I want to omit
// return a new object, do not modify the original object
}
到目前为止，我已经找到了这个解决方案：
let { attr, ...newObj } = obj;
但它只有在attr已知的情况下才有效。我希望attr是动态的，所以attr
浏览 88提问于2019-11-10得票数 4
回答已采纳
1回答
我试图通过mongodb.collection.aggregate()命令合并一些复杂的文档。
假设我希望合并集合文档的x(在下面的示例中: x=2)：
[
{
"_id": 1,
"Data": {
"children": {
"1": {
"name": "appear_only_in_first_doc",
"cost": 1,
"revenue": 4.
浏览 0提问于2020-09-26得票数 1
回答已采纳
我目前正在接触electronjs，在此之前我还没有接触过javascript模块。 在electronjs中，我可以在main.js (主模块)中做到这一点： const { app, BrowserWindow, ipcMain } = require('electron'); 仅基于变量名/L值的名称，require('electron')如何返回三种不同的对象类型/类？ 在哪里可以找到有关此功能如何工作的更多信息？ 我试图通过搜索来找到它，但我想，我在清楚地表达我的问题时真的很糟糕:) 提前感谢大家！
浏览 28提问于2020-10-26得票数 0
回答已采纳
2回答
如何在对象中动态查找键值？
、、、、
我发出的每个API请求都在特定对象中包含不同的键值。如何动态获取第二个key的数值？("123112042") "salesRanks": {
"281052": [ keepaTime, salesRank, ... ]
"123112042": [ keepaTime, salesRank, ... ]
}
浏览 12提问于2021-08-11得票数 0
回答已采纳
我有这个对象
firstObject = {
'a': 1,
'b': 2,
'c': 3,
'd': 4
};
我想创建一个带有一些值的新对象，同时删除它们以供以后使用。
firstObject = {
'a': 1,
'c': 3
};
secondObject = {
'b': 2,
'd': 4
};
哪种方法是正确且更有效的？我见过这样的事情，但我想知道是否有像这样的.pop()方法，但用于对象。
secondObject
浏览 22提问于2020-05-27得票数 0
回答已采纳
我有一个存储useStaticQuery调用结果的变量，但是当我console.log它时，它是未定义的。查询在GraphiQL中工作得很好，那么为什么它不能在useStaticQuery中工作呢 const {backgroundImages} = useStaticQuery(graphql`
query {
allFile(
filter: {extension: {regex: "/(png)/"}, relativeDirectory: {eq: "slider"}}
) {
edges
浏览 14提问于2021-07-08得票数 0
回答已采纳
2回答
我的obj看起来像这样： blogPost: {
questions:
[
{
id: 234
}
]
} 我想要解构id，但这似乎不正确。 const {questions[0]: {id}} = blogPost
浏览 14提问于2019-10-11得票数 0
#include <iostream>
#include <vector>
using namespace std;
#define l(x) cout << (#x) << " : " << x << endl;
#define forf(x, fromY, Step, toZ) for(double x = fromY; x <= toZ; x+=Step)
class Particle {
public:
Particle() {
totalYield = winRat
浏览 1提问于2018-09-03得票数 0
回答已采纳
全新的Firestore，React和Redux。我有一个文档，其中包含一个叫做“问题”的地图(见下图1中的黄色高亮显示)。在这张地图中有问题对象(图1中带下划线的红色1、2、3)。我试图动态地解构问题地图数组，将每个问题的数据传递到一个显示组件中(以使其在用户界面上显示为一张卡片)。
我的代码
结果出现一个错误，说明"questions.map不是一个函数“。
const QuestionList = ({questions}) => { <------ Passed the "questions" map object into this re
浏览 0提问于2020-08-03得票数 1
回答已采纳
我有一个JavaScript对象，格式如下
{
"Node1": [
{
"Node2": "node2detail1",
"Node3": "node3detail1",
"Node4": [
"node4detail1",
]
},
{
"Node2": "node2detail2",
"Node3": "node3detail2
浏览 4提问于2014-08-27得票数 0
回答已采纳
2回答
假设我有一些键值对象。我想从一些键中动态解构，这样我就可以移除它，并只在一个新对象中获得剩余的项。 const omit = (obj, key) => {
const { [key], ...rest } = obj // Syntax error
return rest
}
omit({ b: 1, c: 2, d: 3 }, 'd')
// desired output { b: 1, c: 2 } 有没有办法做到这一点？ 免责声明:我知道有很多变通方法，但我想用解构来解决这个问题。
浏览 26提问于2021-07-29得票数 3
回答已采纳
我很好奇在Javascript中传播和Rest运算符的优先级是什么：
我试图在MDN的运算符优先表()中查找它们，但除非它们是现有运算符类型的子类别，否则我看不到它们。我找不到关于它的任何其他明显的文档。
浏览 11提问于2018-02-07得票数 9
回答已采纳
在下面的代码中，我想用一个变量替换{cash}，这样我就可以从JSON返回任何数据项。你知道怎么做吗？
Javascript：
let chartLabels = arr.map(({date}) => date).reverse();
let chartData = arr.map(({cash}) => cash).reverse();
JSON：
0: "{\"date\":\"2020-03-31\"\"totalAssets\":\"300280000000.00\",\
浏览 13提问于2020-08-04得票数 0
回答已采纳
我的页面在php上运行，没有js-用户。对于拥有javascript的用户，我从索引中加载所有内容动态，并结合hashchangevent。所以这些链接看起来都像www.page.com/#page.php，前面有一个#。如果用户以这种方式键入它，那么每件事情都像魅力一样工作，并且内容正在通过index.php加载。
但是，如果用户输入www.page.com/page.php，那么页面当然会在php页面上结束，而动态页面当然将不再工作，除非用户将点击索引页并继续从该页面导航。所以这不是一个很酷的方法。
我的问题：
如何将用户重定向到：
www.page.com/page.php
至
w
浏览 0提问于2011-09-18得票数 1
回答已采纳
假设我有一个javascript模块first_file.js
var first = "first",
second = "second",
third = "third";
module.exports = {first, second, third};
如何在一行中将这些导入到另一个文件中？以下代码仅导入third
var first, second, third = require('./path/to/first_file.js');
浏览 2提问于2016-01-09得票数 9
回答已采纳
我正在学习react-native。我对react和react-native都是全新的。我也是javascript初学者，尽管我已经用Java编程过一段时间了。 我有这段代码，我正在尝试理解箭头函数： export default function App() {
// A
const DATA = [
{ id: '123',
value: 'First Iem'
},
{ id: '456',
value: 'Second Iem'
},
{
浏览 14提问于2020-07-19得票数 1
回答已采纳
let { * } = {test1: 'test', test2: 'test2'};
Edit1:这里我关心的是右侧对象可能有10个键。
let { key1, key2 , key3 , ..., key10 } =
浏览 0提问于2020-06-24得票数 1
r = {
name:'Bart',
location:'Springfield'
}
for(var a in r) {
if (r.hasOwnProperty(a)) {
console.log(a);
const {a} = r[a]; // Here's where it's failing.
//I'm trying to do the equivalent of const{name} = r[a];
}
}
console.log(name) //Expectin
浏览 0提问于2020-06-23得票数 0
2回答
我在udemy上参加了react课程。我看不懂下面的代码。const InputGroup = (，后面的这个对象做了什么？我见过教程使用，道具，但这里道具是不用的。而是使用一个对象。
const InputGroup = ({
name,
placeholder,
value,
error,
icon,
type,
onChange,
autoComplete,
}) => {
return (
<div className="input-group mb-3">
<div className=&
浏览 2提问于2019-01-12得票数 2
回答已采纳
我将这个接口定义为我的状态：
interface State {
id: string;
name: string;
description: string;
dimensionID: string;
file: File | null;
operator: string;
isFormValid: boolean;
filename: string;
};
我有一个简单的更改处理程序：
update = (event: React.FormEvent<HTMLInputElement>): void => {
const { na
浏览 1提问于2018-10-29得票数 9
2回答
我想重命名密钥，如下所示：
before: Object { check: "cargo check", settings: "Cargo.toml", "create app": "cargo new APPNAME", "build and run": "cargo run / cargo-watch / cargo build --verbose" }
after: Object { MY_NEW_KEY: "cargo check", settings: "Cargo
浏览 0提问于2021-11-04得票数 0
1回答
在我的vue组件中，我有一个我想解构的计算对象。
const profile_state = computed(() => store.getters['profile/GET_STATE']);
因为我需要访问的属性太多了，所以我不想一个一个地创建它们。
有可能有一个解构的计算属性吗？就像这样：
const { name, address, phone, city, token } = computed(() => profile_state);
浏览 4提问于2022-01-08得票数 0
1回答
有没有可能在Serilog中动态覆盖或扩展日志模板？
我有一个逐行解析XML的解析器类，我想用行号扩展日志条目。我已经写了一个更丰富的程序来做这件事，但我必须在函数开始时全局覆盖默认的记录器，并在结束时重置它，这很难(从编程的角度来看) :D
Serilog的其他选项是什么，或者我错过了什么？
浏览 17提问于2020-05-29得票数 0
回答已采纳
我有一个名为dictionary的平面JavaScript对象，我想基于其他平面对象更新它。有时我想将一个对象的每个属性添加到dictionary中，有时我想删除dictionary中存在于另一个对象中的每个键。稍后我将使用这些属性的值，但是为了管理dictionary，我只关心它们的名称。
从问题中，我知道了如何合并属性(例如，使用Object.assign)。我该如何反其道而行之呢？Object.unassign是不存在的，但是有没有类似的东西呢？
例如：
dictionary = { foo: 'bar', baz: 'qux' };
object1 =
浏览 34提问于2018-07-02得票数 4
回答已采纳
我想按键将以下内容汇总起来，并将其值之和：
{
"_id": {
"$oid": "60dd5e0bd0ba24343dabc626"
},
"s": {
"_71vnohpi4": {
"q": 2
}
}
},
{
"_id": {
"$oid": "609ea0b0c85ca8e54adc610c"
},
浏览 6提问于2021-07-02得票数 2
回答已采纳
1回答
我从一个API中提取了一些数据，该API返回如下内容 [{"id":21},{"id":22},{"id":24}] 我将不得不通过不同的API将接收到的数据发送到数据库，但当我发送时，我希望它像[21,22,24]一样发送例如，从API接收数据的变量名为valuesToSend，它来自[{"id":21},{"id":22},{"id":24}]，但当发送时，它应该是[21,22,24]。 postToDb(){
alert(this.valuesToSend)
}
浏览 7提问于2019-05-08得票数 0
回答已采纳
我不知道这在javascript中是否可行。我有一个动态的对象。喜欢
const list = {eb: 'blue', et: 'green'}
无论何时，我的列表值都会发生如下变化
const list = {er: 'yellow', ex: 'black'}
如何在我的对象中获得键值？就像我要展示它的键和价值一样。
const ikey = 'eb'
const ivalue = 'blue'
浏览 0提问于2019-02-24得票数 3
回答已采纳
我目前正在尝试呈现一个具有动态头和动态信息的BootstrapTable。我想出了如何使用这段代码动态地生成标题：
const tableHeaderColumns = this.props.data.viewer.actions.items[0].request.dataset.
items.map((data) => (
<TableHeaderColumn dataField={data.name}>
{data.description}
</TableHeaderColumn>
))
这可以在我的另一个问题中找到：
我要做的是在函数中
浏览 2提问于2017-05-24得票数 0
回答已采纳
我尝试显示以下列表中的项目：
const dataItems = [
{'key': '1','label': 'Informations Basiques', 'icon' : 'person', 'fields': [{'field':'Nom', 'value':'Piedigrossi'}, {'field':'Prénom', 'value':'Guill
浏览 1提问于2018-03-14得票数 0
1回答
结构：
[
{
"_id": "12",
"title": "Vanella Icream",
"contain":"sugar",
"details": [
{
"flavour": "Vanella"
},
{
"weight": "6KG"
}
]
},
{
"_id": "3&#
浏览 1提问于2021-08-18得票数 2
回答已采纳
我被分配到一个正在进行的ReactJs项目中。在查看代码时，我遇到了一个函数定义，其签名如下所示： handleInputs({ target: { name, value } }) { handleInputs是在文本字段的onChange事件上调用的函数。它被称为 onChange={this.handleInputs} 我试图在控制台中输出"target“的值，但是抛出了一个错误。而" name“和" value”的值分别是输入控件的名称和控件中的值。 有人能解释一下函数签名吗？
浏览 28提问于2019-01-31得票数 1
回答已采纳
1回答
在下面的JS (es6)代码中，带冒号的花括号内的变量是怎么回事？
const { foo: bar } = ...
通常，当你看到这一点时，它是从右到左进行变量赋值的，就像在对象中一样。在对象中，它会将变量bar赋给对象键foo，但这似乎不是这里发生的事情。这是在做什么？
浏览 12提问于2017-02-06得票数 2
回答已采纳
1回答
我有一个handleInputBlur函数，它有一个动态参数。假设我有这样的this.props.user对象
{ name: 'abc', age: 10 }
然后在我的UI中，我可以进行内联编辑，因此handleInputBlur将获得一个名为changeField的参数，该参数将是一个包含更改后的字段的对象：
{ age: 10 }
我仍然需要将整个对象传递回后台，如何用现有的对象替换已更新的字段？
我尝试了一下，但得到了一个意外的令牌错误：
handleInputBlur = (changedField) => {
const existingUser
浏览 0提问于2017-08-07得票数 0
回答已采纳
我们目前正在使用带有动态加载/卸载模块的PureMVC框架构建Flex应用程序。我们正在经历内存方面的问题，我们希望用一个基于JavaScript的加载器来取代shell.swf。
两个问题：
什么是动态加载Flex组件并允许模块之间进行通信的好框架？
通过JavaScript动态加载/卸载模块会解决与Flex/Flash应用程序相关的典型内存问题吗？
浏览 1提问于2009-10-23得票数 0
回答已采纳
在我正在处理的代码库中，我不断看到如下所示的函数：
const func = ({ param1, param2 }) => {
//do stuff
}
这到底是在做什么？我很难在谷歌上找到它，因为我甚至不确定这叫什么，或者如何在谷歌搜索中描述它。
浏览 0提问于2016-06-06得票数 155
回答已采纳
我在一个环处理函数中遇到了下面的解构-
[{{:keys [params remote]} :params :as request}]
这很奇怪，因为这是我第一次看到两个级别的花括号。clojure在解构中支持n个级别吗？我假设在上面:params map正在被解构为params remote？
浏览 0提问于2013-03-08得票数 2
回答已采纳
在阅读使用编写软件的文档时，我在index.js文件(通常是执行开始的文件)的开头遇到了这种类型的代码。
const {app, BrowserWindow} = require('electron')
{app, BrowserWindow} (语法，而不是关键字)到底是什么意思？它是一种JavaScript语法，还是node.js之类的东西，或者是专门与电子有关的东西？
浏览 28提问于2017-06-24得票数 5
回答已采纳
2回答
我正在浏览一个代码库，遇到了复杂的语法 return json?.result?.map(
({ text: label, value }: { text: string; value: any }) => ({
label,
value,
}),
); 我模糊地理解(如果我错了，请纠正我) 对于json对象的每个结果，运行一个函数，该函数接受一个对象作为参数并返回另一个对象。 该参数使用此: { text: string; value: any }实现一个接口 我不明白这是怎么回事，尽管{ text: label, value }。label不是在任何地方声明的变量。
浏览 48提问于2020-08-28得票数 0
回答已采纳
我试图从另一个对象创建自定义对象，但是我想让它成为动态对象。 我有一个对象如下所示 {
docType: "Produce",
PRODUCEID: "PRFAINAPCH0005",
PRODUCE: "Sweetcorn",
PRODUCEQUANTITES: [{
name: "Madhuri",
qty: 4000
}],
FARMLOCATION: "Plot 56",
PLANTINGDATE: "2020
浏览 26提问于2020-12-04得票数 0
回答已采纳
1回答
我正在读取，因此下面的代码不再返回false：
function haveES6DuplicatePropertySemantics(){
"use strict";
try {
({ prop: 1, prop: 2 });
// No error thrown, duplicate property names allowed in strict mode
return true;
} catch (e) {
// Error thrown, duplicates prohibited in strict mode
re
浏览 18提问于2015-06-03得票数 21
回答已采纳
我的JavaScript对象如下所示：
"ivrItems": {
"50b5e7bec90a6f4e19000001": {
"name": "sdf",
"key": "555",
"onSelect": "fsdfsdfsdf"
},
"50b5e7c3c90a6f4e19000002": {
"name": "dfgdf",
"key":
浏览 0提问于2012-11-29得票数 6
回答已采纳
我需要创建一个Javascript对象，它将表现为一个关联数组，但是在获取和设置属性之前调用了一些函数。
例如，任务可能如下所示:我们应该创建一个对象，该对象包含一个键的平方值，如下所示：
obj.two should be equal to 4,
obj.four should be equal to 16,
obj['twenty one'] should be equal to 441.
这是一个例子。实际上，我需要使设置操作也被覆盖。获取和设置操作将转到数据库，它们不会将字符串作为键，而是任何类型的对象，从中创建DB查询。
我将如何做到这一点：( a)尽可能少使用第
浏览 6提问于2011-06-17得票数 0
回答已采纳
我不确定这是否是特定于Mozilla的JS语法，但我经常发现变量是这样声明的，例如，在中
var { Hotkey } = require("sdk/hotkeys");
并且在各种chrome Javascript (用let语句代替var)中，
let { classes: Cc, interfaces: Ci, results: Cr, utils: Cu } = Components;
我发现它非常混乱，但我找不到任何关于这两种语法的文档，甚至在上也找不到。
浏览 1提问于2013-03-08得票数 132
回答已采纳
在标记中实现动态属性似乎是不可能的。我想要实现的是：
我想定义我自己的select组件，呈现如下代码：
render() {
return (
<Host>
<select class={this.cssClassMap} aria-label={this.label}>
{
this.options.map((opt) => {
const Tag = 'option';
浏览 11提问于2021-02-15得票数 0
回答已采纳
我有两个收藏品:A和B。它们都由等量的字符组成。我给他们拉链。然后，我需要数对相同的元素，如'A‘和'A’。我需要编写一个谓词，但我无法找到从压缩集合中获得这两个元素的方法。我试过这样的方法：
val num = A.zip(B).count { it.i: Int, it.j:Int -> it.i == it.j}
这是：
val num = A.zip(guess).count { it[0] == it[2] }
但不起作用。如何从这些字符子列表中找到两个元素?我查看了Kotlin的官方示例，但只有简单的例子：
val evenCount = nu
浏览 4提问于2022-06-21得票数 1
回答已采纳
const [a, b, c] = array;
const {a, b, c} = array;
问:这两种说法的区别是什么？
浏览 0提问于2020-01-22得票数 5
1回答
我发现的问题源于尝试将动态OpenGraph元标记应用于Nuxt 3中动态生成的路由(扩展为Vue 3)。
我尝试通过Javascript动态设置元标记，这似乎是Nuxt 3目前支持的唯一动态选项，但没有效果。显然，当请求页面时，它不会运行任何Javascript，这意味着我的元标记不会被应用。
我不希望服务器端呈现这些页面，保持它们动态生成是这个问题的一个重要部分。
到目前为止，我尝试使用<Head>标记，使用content属性动态生成：
<Head>
<Meta hid="og:url" property="og:url"
浏览 8提问于2022-12-03得票数 0
我想在javascript中动态创建以下对象：
{
"data": {
"name": "Bob",
"lastname": "Dole"
}
}
我不确定在不像这样硬编码的情况下做这件事的最佳方法：
var jsonObject =
{
"data": {
"name": "Bob",
"lastname": "Dole"
}
};
在
浏览 3提问于2015-08-13得票数 0
回答已采纳
2回答
我有以下内容：
HelloWorld.js
class HelloWorld extends Component {
render() {
return (
<Text style={styles.text}>Hello World!</Text>
);
}
}
我将它导入到另一个文件中，如下所示：
SignIn.js
class SignIn extends Component {
render() {
return (
<HelloWorld style={styles.signInText} /&g
浏览 3提问于2016-09-29得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
