我想将对象的属性/值与类实例合并。（我不确定 JS 中正确的术语是什么，但示例应该能澄清）
我的尝试是使用扩展语法。见下文。
我有一个文件实例：
const files = listOfFilesFromDragNdrop();
let file = files[0];
console.log(file)
输出类似：
File(2398)
lastModified: 1530519711960
lastModifiedDate: Mon Jul 02 2018 10:21:51 GMT+0200
name: "my_file.txt"
preview: "blob:http://localhost:8080/6157f5d5-925a-4e5d-a466-24576ba1bf7c"
size: 2398
type: "text/plain"
webkitRelativePath: ""
添加后，我使用FileReader .readAsText() 获取内容，并将其包装在一个对象中，例如：
contentObject = getFileContentFromFile()
console.log(contentObject)
会输出类似：
{
preview: "blob:http://localhost:8080/6157f5d5-925a-4e5d-a466-24576ba1bf7c",
content: "Lorem ipsum some text here."
}
我想最终得到一个合并的对象，例如：
{
// "preview" is the key used to map files and content
preview: "blob:http://localhost:8080/6157f5d5-925a-4e5d-a466-24576ba1bf7c",
// "text" is the new field with the content …在研究 JavaScript 的功能时，我在同一函数中使用了默认参数和扩展语法。
let whatIsThis = (a, b = 2, ...c) => {
console.log("a = " + a, "b = " + b,"c = " + c)
}
whatIsThis(a = 1, c = [2,3,4,5,6,7,8])
运行后，我预计输出如下：
"a = 1"
"b = 2"
"c = 2,3,4,5,6,7,8"
但我却得到了这个：
"a = 1"
"b = 2,3,4,5,6,7,8"
"c = "
为什么这不起作用？
我知道您可以使用扩展运算符复制数组：
const itemsArr = [...this.state.itemsArr];
您可以解构一个作为对象键值的数组：
const { itemsArr } = this.state
有没有一种方法可以将它们合并为一个步骤？伪代码：
const { itemsArr } = [...this.state]
或者
const { [...itemsArr] } = this.state
编辑：有没有一种方法可以将它们合并为一个步骤，以避免输入“itemsArr”两次？
这是我在 React 书中找到的一个 JavaScript 箭头函数：
const createArray = (length) => [...Array(length)];
为什么不简单地返回一个新数组呢？
const createArray = (length) => Array(length);
createArray(7)如果我使用任一定义记录结果，我会得到相同的结果：
(7) [undefined, undefined, undefined, undefined, undefined, undefined, undefined]
与第二个定义相比，第一个定义实现了什么？
我想在 php 中执行解构，就像下面的 javascript 代码一样：
[a, b, ...rest] = [10, 20, 30, 40, 50];
console.log(a,b,rest);
输出：
10 20 [ 30, 40, 50 ]
我如何在 php 中执行该操作？
我的 PHP 代码是：
<?php
$array = [10, 20, 30, 40, 50];
// Using the list syntax:
//list($a, $b, $c[]) = $array;
// Or the shorthand syntax:
[$a, $b, $c[]] = $array;
echo "$a<br>$b<br>";
print_r ($c);
?>
哪个打印：
10
20
Array ( [0] => 30 )
但我想要 $c 中的“[ 30, 40, 50 ]”
来自 mdn：传播语法
注意：通常 ES2015 中的扩展运算符在复制数组时会深入一层。因此，它们不适合复制多维数组。Object.assign() 和 Object spread 语法也是如此。请查看下面的示例以更好地理解。
var a = [[1], [2], [3]];
var b = [...a];
b.shift().shift(); // 1
// Now array b is: [[2], [3]]
上述声明的要点是什么？上面的代码示例与您使用 .slice() 方法将 a 中的数组复制到 b 中的工作方式相同。我尝试在此处向数组添加另一个维度：https : //repl.it/HKOq/2并且事情仍然按预期工作。
那么为什么传播语法不适合复制多维数组呢？
我很感激任何帮助。
编辑：
阅读 estus 和 vol7ron 的答案帮助我弄清楚了。基本上，正如 estus 在技术上指出的那样，数组内部只有数组，而不是多维数组。
正如 vol7ron 所解释的，只有数组的第一级被复制，因此内存中的对象对于任何进一步的嵌套元素都保持不变。
我也错误地怀疑使用扩展语法应该与切片运算符的行为有任何不同
我在控制台中执行类似下面的代码
function add(a,b){return a+b;};
const obj = {...add};
令我惊讶的是它没有抛出错误.也没有
const obj = {...123};
扩展语法应该只适用于可迭代的实体,如对象,数组,字符串,映射,集合等.那么为什么在使用不可迭代的实体时它不会抛出错误？或者我在这里遗漏了什么？
我需要做的是映射数组并在所有对象上将值设置为false.这是我的第一枪:
data = data.map((item) => {
item.active = false;
return item;
})
作品!但后来有Eslint,没有param-reassign.所以我必须找到别的东西.经过一些谷歌搜索后,我找到了传播操作员!真棒!我创造了这个杰作:
data = data.map((item) => {
return {...item, active: false}
})
看起来很酷,也很好用.但是再次有Eslint,箭身式.好的我会在同一行返回对象:
data = data.map(item => {...item, active: false});
不行!:'(我错过了什么？
我添加了一个脚本,该脚本使用ES6扩展运算符到从url获取params的项目.在我发现项目不支持ES6之后,不确定如何将其恢复为正常的vanilla Javascript语法.
使用普通的Javascript数组并使用扩展运算符很容易,但在像这样的更复杂的实例中,我无法使数组在不完全更改脚本的情况下返回结果.
getQueryURLParams("country");
getQueryURLParams = function(pName) {
var urlObject = location.search
.slice(1)
.split('&')
.map(p => p.split('='))
.reduce((obj, pair) => {
const [key, value] = pair.map(decodeURIComponent);
return ({ ...obj, [key]: value }) //This is the section that needs to be Vanilla Javascript
}, {});
return urlObject[pName];
};
感谢大家的回复.在来回之后,我意识到我将整个脚本转换为ES5的建议是正确的,因为浏览器只抱怨该行,但其他项目不是ES5也是有问题的.
这是我使用ES5后的情况:
getQueryURLParams = function(pName) {
if (typeof Object.assign != 'function') {
// Must be writable: true, enumerable: false, configurable: true
Object.defineProperty(Object, "assign", {
value: function assign(target, varArgs) { // .length of function …javascript arrays ecmascript-6 spread-syntax ecmascript-2018
我正在使用节点,我已经使用过.
巴贝尔节点
"start": "nodemon --exec babel-node --presets es2015 index.js"
我的传播语法没有按预期工作.这是我的代码.
export const login = async (parentValue, { email, password }) => {
try {
const user = await User.findOne({
email
});
console.log(user);
if (!user.authenticateUser(password)) {
throw new Error('Wrong password');
}
const dummyObject = {
...user
};
console.log({ dummyObject });
return { ...user };
} catch (e) {
console.log(e);
throw new Error(e.message);
}
};
我使用的线console.log(user),它工作正常.它回来了
{
id: xxx,
name: xxxx
}
我得到了意想不到的数据console.log(dummyObject); 这就是我得到的.
{ jojo:
{ '$__': …