在 JavaScript 中将数组转换为带空格的字符串

Convert Array to String with Spaces in JavaScript

使用该Array.join()方法将数组转换为带空格的字符串，例如const withSpaces = arr.join(' ');.

该Array.join()方法将返回一个字符串，其中包含由空格分隔的数组元素。

索引.js


const arr = ['bobby', 'hadz', 'com'];

const withSpaces = arr.join(' ');
console.log(withSpaces); // 👉️ 'bobby hadz com'

console.log(typeof withSpaces); // 👉️ string

Array.join
()
方法使用分隔符连接数组中的所有元素。

该Array.join()方法采用的唯一参数是separator– 用于分隔数组元素的字符串。

如果separator省略参数值，则数组元素用逗号连接,。

索引.js


const arr = ['bobby', 'hadz', 'com'];

console.log(arr.join()); // 👉️ "bobby,hadz,com"

如果separator参数设置为空字符串，则数组元素之间没有任何字符连接。

索引.js


const arr = ['bobby', 'hadz', 'com'];

console.log(arr.join('')); // 👉️ "bobbyhadzcom"

如果分隔符是包含空格的字符串，则所有数组元素都由空格连接。

索引.js


const arr = ['bobby', 'hadz', 'com'];

console.log(arr.join(' ')); // 👉️ "bobby hadz com"

如果您需要将数组转换为具有不同分隔符的字符串，请将字符作为参数传递给该Array.join()方法。

索引.js


const arr = ['bobby', 'hadz', 'com'];

const withSpaceAndComma = arr.join(', ');
console.log(withSpaceAndComma); // 👉️ 'bobby, hadz, com'

const withHyphens = arr.join('-');
console.log(withHyphens); // 👉️ 'bobby-hadz-com'

const withoutSeparator = arr.join('');
console.log(withoutSeparator); // 👉️ 'bobbyhadzcom'

如果join在一个空数组上调用该方法，它会返回一个空字符串。

索引.js


console.log([].join(' ')); // 👉️ ''

如果调用该方法的数组包含或空数组join的元素
null，它们将转换为空字符串。undefined[]

索引.js


const arr = ['a', undefined, 'c'];

console.log(arr.join(' ')); // 👉️ 'a c'

我们的数组包含一个值为的元素undefined，因此它被转换为一个空字符串。

If you need to remove the null and undefined values from an array before
calling the Array.join() method, use the Array.filter() method.

index.js


const arr = [null, 'bobby', undefined, 'hadz', null, 'com'];

const str = arr
  .filter(element => {
    return element !== null && element !== undefined;
  })
  .join(' ');

console.log(str); // 👉️ "bobby hadz com"

The function we passed to the
Array.filter()
method gets called with each element in the array.

On each iteration, we check if the element is not equal to null and
undefined and return the result.

The filter() method returns a new array that only contains the elements that
meet the condition.

index.js


const arr = [null, 'bobby', undefined, 'hadz', null, 'com'];

// 👇️ [ 'bobby', 'hadz', 'com' ]
console.log(
  arr.filter(element => {
    return element !== null && element !== undefined;
  }),
);

If you have to do this often, define a reusable function.

index.js


function toStringWithSpaces(array, separator = ' ') {
  return array
    .filter(element => {
      return element !== null && element !== undefined;
    })
    .join(separator);
}

const arr = [null, 'bobby', undefined, 'hadz', null, 'com'];

const str1 = toStringWithSpaces(arr);
console.log(str1); // 👉️ bobby hadz com

const str2 = toStringWithSpaces(arr, '-');
console.log(str2); // 👉️ bobby-hadz-com

The function takes an array and optionally a separator and converts the array to
a string based on the provided separator.

–