我有以下代码,它返回一个数组:
const authorsName = [];
this.props.authors.map((e) => authorsName.push(e.name + ' ' + e.surname));
console.log(authorsName)
// ["Jonh Snow", "Jonh Rain"]
但是当我尝试使用以下代码发送此数组时:
const s = document.createElement('script');
s.type = 'text/javascript';
s.innerHTML = `window.customConfig.push({
page_type: "article",
article_authors: "${authorsName}"
})`;
authorsName
数组变成下一个字符串:
article_authors: "Jonh Snow,Jonh Rain",
我不明白为什么会这样。请告诉我这是什么问题。预先感谢。
答案 0 :(得分:1)
首先,以这种方式使用Array.map()是有效的,但这并不完全正确。请记住,.map()
返回一个新数组,其中每个元素都以某种方式从原始元素派生而来,并且不对原始数组进行突变。因此,如果您执行以下操作会更好:
const authorsName = this.props.authors.map(e => e.name + ' ' + e.surname);
使代码与您提供的代码更相似的另一种选择是通过以下方式使用Array.forEach():
const authorsName = [];
this.props.authors.forEach(e => authorsName.push(e.name + ' ' + e.surname));
现在,在您的下一个代码上:
s.innerHTML = `window.customConfig.push({
page_type: "article",
article_authors: "${authorsName}"
})`;
使用Array.toString()方法将authorsName
数组强制转换为字符串,然后MDN
接下来说:
对于Array对象,
toString
方法将连接数组并返回一个字符串,其中包含每个用逗号分隔的数组元素。当数组表示为文本值或在字符串连接中引用数组时,JavaScript自动自动调用toString
方法。
因此,您需要使用JSON.stringify()将数组转换为其的JSON
表示形式。
s.innerHTML = `window.customConfig.push({
page_type: "article",
article_authors: "${JSON.stringify(authorsName)}"
})`;
在下一个示例中,您可以检查使用toString()
和JSON.stringify()
的区别:
let arr = [1,2,3];
console.log("With toString() =>", arr.toString());
console.log("With JSON.stringify() =>", JSON.stringify(arr));
.as-console {background-color:black !important; color:lime;}
.as-console-wrapper {max-height:100% !important; top:0;}
答案 1 :(得分:0)
article_authors
被插入到一个字符串中,即使它是一个数组。
如果您希望第一个代码段中包含该字符串,请尝试以下操作:
const authors = [
{name: "Jonh",
surname: "Snow"},
{name: "Jonh",
surname: "Rain"}
]
const authorsName = [];
const output = authors.map((e)=> authorsName.push(e.name + ' ' + e.surname));
console.log(authorsName)
const s = document.createElement('script');
s.type = 'text/javascript';
s.innerHTML = `
window.customConfig.push({
page_type: "article",
article_authors: "${JSON.stringify(authorsName)}"
})
`;
console.log(s.innerHTML)
答案 2 :(得分:0)
当您在字符串中包含对象时,将调用toString方法以从中生成字符串。数组逗号上的toString方法使数组内容明了。
console.log([1,2,3,4].toString());
如果要使用其他格式,则可以在数组上调用join来按不同顺序连接元素。
console.log([1,2,3,4].join(', '));
console.log([1,2,3,4].join(' / '));
console.log([1,2,3,4].join(' - '));