Usage and difference of join(), split(), slice() functions in JavaScript

When brushing buttons, these functions are often used when dealing with string array problems, but it is always easy to confuse them. Now I will summarize them for the convenience of viewing next time.

One: Array.prototype.join()

The join() method concatenates all elements of an array (or an array-like object ) into a string and returns the string, separated by commas or the specified delimiter string. If the array has only one element, then that element will be returned without a 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"
  • If the parameters in the function are omitted , the array elements are separated by commas ( ,) . If it is an empty string ( "") , there will be no characters between any elements
  • If an element is  undefined  , it will be converted to an empty stringnull

二:String.prototype.split()

 The split() method splits a String object into an array of substrings using the specified delimiter string , using a specified split string to determine the position of each split.

const str = 'The quick brown fox jumps over the lazy dog.';

const words = str.split(' ');
console.log(words[3]);
// Expected output: "fox"

const chars = str.split('');
console.log(chars[8]);
// Expected output: "k"

const strCopy = str.split();
console.log(strCopy);
// Expected output: Array ["The quick brown fox jumps over the lazy dog."]
  • If the delimiter is omitted in str , the returned array contains one element consisting of the entire string
  • If the delimiter is an empty string , return str as an array of each character in the original string

Note: If an empty string (") is used as the delimiter, the string is not between each user-perceived character (graphic pixel cluster), nor between each Unicode character (code point), but between between each UTF-16 code unit. This destroys surrogate pairs.

三:Array/String.prototype.slice()

The slice() method has both arrays and strings, and the usage methods are similar. The following uses arrays as an example to introduce

The slice() method returns a new array object, which is a shallow copy of the original array determined by begin  and end (including begin, excluding end ). The original array will not be changed .

const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2));
// Expected output: Array ["camel", "duck", "elephant"]

console.log(animals.slice(-2));
// Expected output: Array ["duck", "elephant"]

console.log(animals.slice(2, 4));
// Expected output: Array ["camel", "duck"]

console.log(animals.slice(2, -1));
// Expected output: Array ["camel", "duck"]

console.log(animals.slice());
// Expected output: Array ["ant", "bison", "camel", "duck", "elephant"]

Guess you like

Origin blog.csdn.net/qq_42691298/article/details/128665452