Strings

JavaScript Strings （JavaScript字符串）

In JavaScript, the strings are used for storing and manipulating text. No separate type exists for a single character. The strings internal format is always UTF-16. （在JavaScript中，字符串用于存储和操作文本。单个字符不存在单独的类型。字符串内部格式始终为UTF-16。）

A string represents zero or more characters that are written inside quotes. （字符串表示写在引号内的零个或多个字符。）

About Quotes #

About Quotes （关于报价）

We can distinguish single quotes, double quotes, and backticks:

let single = 'single-quoted';
let double = "double-quoted"; 
let backticks = `backticks`;

Double and single quotes are the same. Anyway, backticks are different. You can use them for embedding any expression into the string by wrapping it in ${…} as follows:

let str = "w3cdoc"; 
console.log(`Welcome to ${str}`); // Welcome to w3cdoc

One of the most crucial advantages of backticks is that they allow a string to span numerous lines like this:

let languagesList = `Languages:
* Javascript
（ Javascript）
* Php
（PHP）
* Java
`;
console.log(languagesList); // a list of languages, multiple lines

But, note that single and double quotes will now work in this case. If you use them trying to apply multiple lines, an error will occur:

let guestList = "Guests: // Error: Unexpected token ILLEGAL 
* John ";

Single and double quotes appeared earlier than the backticks. Thus the backticks are more functional. （单引号和双引号比反引号出现得更早。因此，反引号更具功能性。）

You can also specify a “template function” before the first backtick. The syntax will look like this:

func `string`

As a rule, the func function is called automatically. It receives both the string and embedded expressions processing them. Using this feature, you can quickly implement custom templating. Anyway, developers rarely use it in practice. （通常， func函数会自动调用。它接收处理它们的字符串和嵌入式表达式。使用此功能，您可以快速实现自定义模板。无论如何，开发人员在实践中很少使用它。）

Special Characters #

Special Characters （特殊字符）

You can create multiline strings with double and single quotes with the help \n, like this:

let languagesList = "Languages:\n * Javascript\n * Php\n * Java";
console.log(languagesList); // a multiline list of languages

There exist other less common special characters. （还有其他不太常见的特殊字符。）

Find some of them in the list below:

• ', " these special characters are used for quotes （-\ ‘,\ “这些特殊字符用于引号）

• \r - carriage return. This character is now used alone. A combination of two characters \r\n is used for representing a line break in Windows text files. （-\ r -回车。此字符现在单独使用。两个字符的组合\ r\ n用于表示Windows文本文件中的换行符。）

• \ - backslash （反斜杠）

• \t - tab （-\ t -制表符）

• \xXX - unicode character with a particular hexadecimal unicode XX （-\ xXX -带有特定十六进制Unicode XX的Unicode字符）

• \uXXXX - this is unicode symbol with the hex code XXXX in UTF-16 encoding. It must include exactly 4 digits. （-\ uXXXX -这是使用UTF-16编码的十六进制代码XXXX的Unicode符号。必须包含4位数字。）

Here are examples with unicodes:

console.log("\u00E9"); // é
console.log("\u{03BB}"); // λ

Take into account that all special characters begin with a backslash. It is also known as an “escape character.” （请注意，所有特殊字符都以反斜杠开头。它也被称为“逃避角色”。）

You can also use it in case you wish to put a quote into the string. （如果您想在字符串中输入引号，也可以使用它。）

Here is an example:

console.log('This\'s the w3cdoc site!'); // This’s the w3cdoc site

Also, consider that backslash is mainly used for correcting reading of the string by JavaScript, after which it disappears. In the string memory, you can’t find any \ . But when you need to show an actual backslash within the string, you should double it like in this example:

console.log(`The backslash: \\`); // The backslash: \ 
let backslash = "aa ///\\"; //  This is correct
// let backslash = "aa ///\"; // This is not.
console.log(backslash);

The String Length #

The String Length （字符串长度）

The length property is used for finding the length of a string:

console.log(`w3cdoc\n`.length); // 7

Take into account that \n is a special character. Hence the length should be 7. （请注意，\ n这是一个特殊字符。因此，长度应为7。）

Sometimes developers mistype this property by calling str.length() instead of just str.length. That will not work. （有时，开发人员通过调用str.length ()而不仅仅是str.length来错误地键入此属性。那行不通的。）

Accessing Characters #

Accessing Characters （访问字符）

Square brackets[pos] are mainly used for getting a character at a position [pos]. You can do that by calling the str.charAt(pos) method, as well. The very first character should start from zero:

let str = `Welcome`; 
// the first character
console.log(str[0]); // W
console.log(str.charAt(0)); // W
// the last character
console.log(str[str.length - 1]); // e

Modern developers prefer to use the square brackets, while the charAt is rarely used （现代开发人员更喜欢使用方括号，而charAt很少使用）

Strings are Changeless #

Strings are Changeless （弦是无变化的）

It is not possible to change the strings in JavaScript. Look at this example to make sure that it won’t work:

let str = 'Welcome';
str[0] = 'w'; 
console.log(str[0]);

The common practice is creating a whole new string assigning it to str instead of the old one like this:

let str = 'Hi';
str = 'h' + str[1]; // replace the string
console.log(str); // hi

Case Changing #

Case Changing （案例转换）

We can distinguish two methods of changing the case. Here they are:

console.log('Welcome to w3cdoc'.toUpperCase()); // WELCOME TO w3cdoc
console.log('Welcome to w3cdoc'.toLowerCase()); // welcome to w3cdoc

In another scenario, if it a single character should be lowercase, use this method:

console.log('Welcome to w3cdoc' [0].toLowerCase()); // 'w'

Looking for a Substring #

Looking for a Substring （查找子字符串）

Let’s discover the ways of searching for a substring inside a string. （让我们了解在字符串中搜索子字符串的方法。）

str.indexOf #

str.indexOf

This is the first method that is used for searching for the substr in str. It starts from the particular position pos and returns that position at the time the match is found, or -1, in case nothing is found. （这是用于在str中搜索substr的第一种方法。它从特定位置位置开始，并在找到匹配项时返回该位置，如果没有找到，则返回-1。）

Let’s check out the following example:

let str = 'Welcome to w3cdoc'; 
console.log(str.indexOf('Welcome')); // 0, because 'Welcome' is found at the beginning
console.log(str.indexOf('welcome')); // -1, not found, the search is case-sensitive
console.log(str.indexOf("w3cdoc")); // 11, "w3cdoc" is found at the position 11

str.lastIndexOf(substr, position) #

str.lastIndexOf(substr, position) （str.lastIndexOf (substr, position)）

This method searches from the end of a string to the beginning. The occurrences will be listed in the reverse order. （此方法从字符串的末尾到开头进行搜索。发生次数将按相反的顺序列出。）

Consider a slight difficulty with indexOf inside the if test. It can’t be put in if in this way:

let str = "Welcome to w3cdoc";
if (str.indexOf("Welcome")) {
 console.log("Thank you"); // doesn't work!
}

So, it is necessary to check for the -1, as follows:

let str = "Welcome to w3cdoc";
if (str.indexOf("Welcome") != -1) {
 console.log("Thank you"); // works now
}

Includes, startsWith, endsWith #

Includes, startsWith, endsWith （Includes、startsWith、endsWith）

The more contemporary method str.includes(substr, pos) is capable of returning true/false depending on whether there is substr in the str. （更现代的方法str.includes (substr, pos)能够返回true/false ，具体取决于字符串中是否有substr。）

Act like in the example, if you need to test for the match not needing its position at the same time:

console.log("Welcome to w3cdoc".includes("Welcome")); // true
console.log("Hi".includes("Bye")); // false

The second argument of str.includes is position you start searching from. Here is an example:

console.log("Welcome".includes("come")); // true
console.log("Welcome".includes("come", 5)); // false, from position 5 there is no "come"

Getting a Substring #

Getting a Substring （获取子字符串）

JavaScript includes three methods of getting a substring: substring, substr, and slice.

str.slice(start [, end]) （str.slice (start [, end])）

This method is used for returning the part of the string from start to end. （此方法用于从头到尾返回字符串的部分。）

For example:

let str = "welcome";
console.log(str.slice(0, 6)); // 'welcom', the substring from 0 to 6 (not including 6)
console.log(str.slice(0, 1)); // 'w', from 0 to 1, but not including 1, so only character at 0

If a second argument is absent, the slice will go until the end, like this:

let str = "welcome";
console.log(str.slice(3)); // 'come', from the 3-position till the end

For start/end you can also use negative values. （对于开始/结束，您也可以使用负值。）

For instance:

let str = "welcome "; 
// start at the 5th position from the right, end at the 1st from the right
console.log(str.slice(-5, -1)); // 'come'

str.substring(start [, end]) （str.substring (start [, end])）

This method is used for returning the part of the string between the start and the end. （此方法用于返回字符串的开始和结束之间的部分。）

It looks much like slice. The most notable difference is that in the framework of this method, the start can be greater than the end. （它看起来很像切片。最明显的区别是，在此方法的框架中，开始可以大于结束。）

For example:

let str = "welcome";
// these are same for substring
console.log(str.substring(3, 6)); // "com"
console.log(str.substring(6, 3)); // "com"
// ...but not for slice:
console.log(str.slice(3, 6)); // "com" (the same)
console.log(str.slice(6, 3)); // "" (an empty string)

str.substr(start [, length]) （str.substr (start [, length])）

This method returns the part of the string from the start, with a particular length. It differs from the previous methods. This method will help you specify the length instead of the ending position. （此方法返回字符串从一开始就具有特定长度的部分。它与以前的方法不同。此方法将帮助您指定长度而不是结束位置。）

For instance:

let str = "welcome";
console.log(str.substr(3, 4)); // 'come', from the 3-position get 4 characters

The first argument might be negative for counting from the end:

let str = "welcome";
console.log(str.substr(-4, 2)); // 'co', from the 4th position get 2 characters

Comparison of the Strings #

Comparison of the Strings （字符串比较）

It is essential to know that strings should be compared character-by-character in alphabetical order. （重要的是要知道字符串应按字母顺序逐个字符进行比较。）

It would be best if you also considered the following characteristics:

console.log('a' > 'Z'); // true

For example:

console.log('Germany' > 'England'); // true

Now, let’s start reviewing the internal representation of strings in JavaScript. （现在，让我们开始回顾JavaScript中字符串的内部表示。）

In JavaScript, we encode all strings using UTF-16. It means that each of the characters has an appropriate numeric code. （在JavaScript中，我们使用UTF-16对所有字符串进行编码。这意味着每个字符都有适当的数字代码。）

str.codePointAt(pos) （str.codePointAt (pos)）

It is used for returning the code for the character at position pos :

// different case letters have different codes
console.log("w".codePointAt(0)); // 119
console.log("W".codePointAt(0)); // 87

String.fromCodePoint(code) （String.fromCodePoint （代码））

Makes a character by the numeric code:

console.log(String.fromCodePoint(80)); // P

Unicode characters can also be added by their codes applying \u followed by the hex code. （也可以通过应用\ u后跟十六进制代码的代码来添加Unicode字符。）

For instance:

// 90 is 5a in hexadecimal system
console.log('\u005a'); // Z

Let’s have a look at the characters with codes 65..220 and make a string of them:

let str = ''; 
for (let i = 65; i <= 220; i++) {
 str += String.fromCodePoint(i);
}
console.log(str);
// ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcdefghijklmnopqrstuvwxyz{|}~€‚ƒ„
// ¡¢£¤¥¦§¨©ª«¬­®¯°±²³´µ¶·¸¹º»¼½¾¿ÀÁ ÃÄÅÆÇÈÉÊËÌÍÎÏÐÑÒÓÔÕÖ×ØÙÚÛÜ

Here, you can notice that capital characters go first, then several special characters, and finally, Ö at the end of the output. （在这里，您可以注意到，大写字符首先出现，然后是几个特殊字符，最后是输出末尾的Ö。）