admin管理员组文章数量:1221352
I'm not sure where this is going wrong. I've seen several posts about this specific example from O'Reilly's Learning React, by Banks and Porcello. However, the posts appear to function properly, but my example does not. I don't notice typos. What is the source of my flaw? I'm not sure why I get "HB Woodlawn" instead of a null string value.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
<script src="/[email protected]/babel.min.js"></script>
</head>
<body>
<script type="text/babel">
// Editing one object in an array of objects
let schools = [
{name: 'Yorktown'},
{name: 'Stratford'},
{name: 'Washington & Lee'},
{name: 'Wakefield'}
];
const editName = (oldName, newName, arr) =>
arr.map(item => {
if (item.name === oldName) {
return {
...item,
name
}
}
else {
return item
}
});
let updatedSchools = editName('Stratford', 'HB Woodlawn', schools);
console.log(updatedSchools[1]); // name: ""
console.log(schools[1]); // name: "Stratford"
</script>
</body>
</html>
I'm not sure where this is going wrong. I've seen several posts about this specific example from O'Reilly's Learning React, by Banks and Porcello. However, the posts appear to function properly, but my example does not. I don't notice typos. What is the source of my flaw? I'm not sure why I get "HB Woodlawn" instead of a null string value.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
<script src="https://unpkg.com/[email protected]/babel.min.js"></script>
</head>
<body>
<script type="text/babel">
// Editing one object in an array of objects
let schools = [
{name: 'Yorktown'},
{name: 'Stratford'},
{name: 'Washington & Lee'},
{name: 'Wakefield'}
];
const editName = (oldName, newName, arr) =>
arr.map(item => {
if (item.name === oldName) {
return {
...item,
name
}
}
else {
return item
}
});
let updatedSchools = editName('Stratford', 'HB Woodlawn', schools);
console.log(updatedSchools[1]); // name: ""
console.log(schools[1]); // name: "Stratford"
</script>
</body>
</html>
Share
Improve this question
edited Apr 20, 2023 at 13:51
Ashish Kumar Saxena
4,7108 gold badges30 silver badges48 bronze badges
asked Dec 18, 2017 at 9:45
Ron Allen SmithRon Allen Smith
6032 gold badges7 silver badges19 bronze badges
3
|
1 Answer
Reset to default 15let schools = [
{name: 'Yorktown'},
{name: 'Stratford'},
{name: 'Washington & Lee'},
{name: 'Wakefield'}
];
const editName = (oldName, newName, arr) =>
arr.map(item => {
if (item.name === oldName) {
return {
...item,
name: newName
}
}
else {
return item
}
});
let updatedSchools = editName('Stratford', 'HB Woodlawn', schools);
console.log(updatedSchools[1]); // name: ""
console.log(schools[1]); // name: "Stratford"
You hadn't added the new value for the name, instead had left it empty. Added name:newName
本文标签: javascriptWhy is my map() with spread syntax not workingStack Overflow
版权声明:本文标题:javascript - Why is my map() with spread syntax not working? - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1739294092a2156828.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
...
is not an operator. (And before anyone says it: Ignore the URL on the MDN page, it was an error by the person who created the page.) – T.J. Crowder Commented Dec 18, 2017 at 9:52...
is spread operator right? – illiteratewriter Commented Dec 18, 2017 at 9:57