数组转换为字符串

时间:2019-06-26 02:12:24

标签: javascript arrays object

我有以下代码,它返回一个数组:

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",

我不明白为什么会这样。请告诉我这是什么问题。预先感谢。

3 个答案:

答案 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(' - '));