二、原始字符串与 String 对象
在 JavaScript 中,字符串有两种形式:
原始字符串(Primitive String):直接用字面量声明,如 "abc"。
String 对象(String Object):通过 new String("abc") 创建。
示例:
代码高亮:
let str1 = "abc";           // 原始字符串
let str2 = new String("abc"); // 字符串对象
它们的区别:

可以看到,虽然两者内部的字符串值相同,但 new String 创建的是对象类型,容易在逻辑判断中出错:
if (new String("")) console.log("执行"); // 会执行,因为对象永远 truthy
if ("") console.log("执行");             // 不会执行
建议:除非做语言机制实验,否则使用原始字符串即可。
三、字符串的属性与方法
1. length 属性
原始字符串虽然不是对象,但在访问属性或方法时,JavaScript 会自动装箱,临时把原始字符串包装成 String 对象:
let str = "hello";
console.log(str.length); // 5
这个机制也适用于调用方法,例如:
console.log("abc".toUpperCase()); // "ABC"
2. 常用方法
代码高亮:
str.charAt(0);        // 返回第一个字符
str.includes("he");   // 判断是否包含
str.startsWith("he"); // 是否以指定字符串开头
str.endsWith("lo");   // 是否以指定字符串结尾
str.indexOf("l");     // 第一次出现位置
str.lastIndexOf("l"); // 最后一次出现位置
str.slice(0, 3);      // "hel"  支持负数
str.substring(0, 3);  // "hel"  不支持负数
str.split(" ");       // ["hello", "world"]
str.toUpperCase(); // "HELLO"
str.toLowerCase(); // "hello"
str.replace("hello", "hi");      // 替换一次
str.replaceAll("l", "*");        // 替换全部
代码高亮:
str.trim();       // 去头尾空格
str.trimStart();  // 去开头空格
str.trimEnd();    // 去尾部空格
"5".padStart(3, "0"); // "005"
"5".padEnd(3, "0");   // "500"
"abc".repeat(3);      // "abcabcabc"
四、数组的 map 方法
数组是 JavaScript 中另一类常用数据结构,map 是最重要的方法之一。它遍历数组的每个元素,并返回由每次回调函数返回值组成的新数组。
示例:
const todos = [
    { id: 1, text: '学习es6' },
    { id: 2, text: '通读你不知道的JavaScript' }
];
const liList = todos.map(todo => `<li>${todo.text}</li>`);
console.log(liList);
// ["<li>学习es6</li>", "<li>通读你不知道的JavaScript</li>"]
注意:
todos.map(todo => `<li>${todo.text}</li>`);
代码高亮:
const todosEL = document.querySelector('.todos');
todosEL.innerHTML = `
<ul>
  ${todos.map(todo => `<li>${todo.text}</li>`).join('')}
</ul>
`;