Js中字符串与数组转换（相关API）

迦南

一、数组转字符串

需要将数组元素用某个字符连接成字符串，示例代码如下：

var a, b;
a = new Array(0,1,2,3,4);
b = a.join("-");

二、字符串转数组

实现方法为将字符串按某个字符切割成若干个字符串，并以数组形式返回，示例代码如下：

var s = "abc,abcd,aaa";
ss = s.split(",");// 在每个逗号(,)处进行分解。

■ map

map() 方法创建一个新数组，其结果是该数组中的每个元素是调用一次提供的函数后的返回值。

const array1 = [1, 4, 9, 16];
// pass a function to map
const map1 = array1.map(x => x * 2);
console.log(map1);
// expected output: Array [2, 8, 18, 32]

求数组中每个元素的平方根

求数组中每个元素的平方根

var numbers = [1, 4, 9];
var roots = numbers.map(Math.sqrt);
// roots的值为[1, 2, 3], numbers的值仍为[1, 4, 9]

使用 map 重新格式化数组中的对象
使用一个包含一个参数的函数来mapping(构建)一个数字数组

为什么["1","2","3"].map(parseInt) 返回[1,NaN,NaN]？

疑问：Javascript中的parseInt与map函数都是常用的函数，可是 ["1", "2", "3"].map(parseInt) 为何返回不是[1,2,3]却是[1,NaN,NaN]？

■ join

所有的数组元素被转换成字符串，再用一个分隔符将这些字符串连接起来。

join() 方法将一个数组（或一个类数组对象）的所有元素连接成一个字符串并返回这个字符串。如果数组只有一个项目，那么将返回该项目而不使用分隔符。
如果一个元素为 undefined 或 null ，它会被转换为空字符串。

分隔符

指定一个字符串来分隔数组的每个元素。如果需要，将分隔符转换为字符串。如果缺省该值，数组元素用逗号（ , ）分隔。如果 separator 是空字符串( "" )，则所有元素之间都没有任何字符。

示例一

const elements = ['Fire', 'Air', 'Water'];
console.log(elements.join());
// expected output: "Fire,Air,Water"
console.log(elements.join(''));
// expected output: "FireAirWater"
console.log(elements.join('-'));
// expected output: "Fire-Air-Water"

示例二

var a = ['Wind', 'Rain', 'Fire'];
var myVar1 = a.join();      // myVar1的值变为"Wind,Rain,Fire"
var myVar2 = a.join(', ');  // myVar2的值变为"Wind, Rain, Fire"
var myVar3 = a.join(' + '); // myVar3的值变为"Wind + Rain + Fire"
var myVar4 = a.join('');    // myVar4的值变为"WindRainFire"

示例三

var arr = ['唱','跳','Rap','篮球'];
var arrStr1 = arr.join(); console.log(arrStr1); // "唱,跳,Rap,篮球"
var arrStr2 = arr.join(',');console.log(arrStr2); // "唱,跳,Rap,篮球"
var arrStr3 = arr.join('');console.log(arrStr3); // "唱跳Rap篮球"
var arrStr4 = arr.join(' ');console.log(arrStr4); // "唱 跳 Rap 篮球"
var arrStr5 = arr+'';console.log(arrStr5); // "唱,跳,Rap,篮球"

join() 和 toString()的区别详解

自己经常搞错

通过join()会合并成一个字符串
通过toString()会根据原数组，依次变成字符串

从上面绿色画笔的地方可以看出来，这两种数组转字符串的方法有细微区别的，要小心

js两种拼接字符串方法

function(msgArr) {
    //参数为一个数组，每一个对象为图片id和图片地址
    var len = msgArr.length;
    //第一种拼接方式，直接用“+”连接起来
    var htmlSpan = "";
    for (var j = 0; j < len - 1; j++) {
        htmlSpan += '<span>·</span>';
    htmlSpan += '<span class="on">·</span>';
    //第二种拼接方式，用数组的.join('')方法
    var imgs = [];
    var img = [];
    img[0] = '<a href="' + ctx + '/webservice/dish/detail?id=';
    img[1] = '#';
    img[2] = '"><img src="';
    img[3] = '#';
    img[4] = '"></a>';
    for (var i = 0; i < len; i++) {
        img[1] = msgArr[i].id;
        img[3] = msgArr[i].pic;
        imgs.push(img.join(''));