ES6 学习笔记（六）基本类型String

2023-03-04 16:47:37 浏览数 (2)

本文最后更新于 128 天前，其中的信息可能已经有所发展或是发生改变。

字符串String

1、字面量

需要注意的地方：

  • 由单引号或双引号括起来的字符序列。
  • 单双引号可以嵌套，由最外围引号定界字符串
  • 字符串字面量可以拆分成数行，每行必须以反斜线（）结束，且反斜线都不计入字符串的内容。
  • 在书写HTML的JS代码时，要注意与HTML代码混合搭配使用引号。

实例代码：

代码语言：javascript复制
let str1 = "I have a dog"
let str2 = "My 'dog' likes 
eating meat"
console.log(str1) // I have a dog
console.log(str2);// My 'dog' likes eating meat
代码语言：javascript复制
// 点击弹出hello
<button onclick="alert('hello')"></button>

2、转义字符

类型

描述

’

单引号

”

双引号

n

换行

r

回车

反斜线

xA9

十六进制数表示Latin-1编码的版权符号©

u03C0

表示Unicode编码的字符π

3、字符的Unicode表示法

  • JavaScript允许采用uxxxx形式表示一个字符。其中，xxxx表示字符的Unicode编码。如：”u0061”表示“a”
  • 这种编码仅能表示u0000~uFFFF之间的字符。
    • 超出这个范围的字符，必须采用2个双字节的形式表示。 如：”uD842uDFB7”表示“?”
    • 超过这个范围的编码则会被截取。如：”u20BB7”—->"₻7"
  • ES6提出的改进方案，利用大括号将整个编码括起来，从而识别为一个字符。如：”u{20BB7}”表示”?”

4、String方法

表示字符串拼接。

代码语言：javascript复制
let s1 = "Java"
let s2 = "Scripts"
console.log(s1   s2) // JavaScripts
console.log("abc"   { value: 10 }) // abc[object Object]  类型名  构造函数名
console.log("abc"   { value: 10, toString: function () { return    this.value.toString(); } }); // abc10

String()，toString()，valueof()。

String()直接将传入的参数转化为字符串

toString()返回字符串描述

valueof()返回原始值

代码语言：javascript复制
let str = new String("abc123")
console.log(str.valueOf()); // abc123
console.log(str.toString()); // abc123
console.log(new Date().valueOf()) // 1617794519537

5、String构造函数

通过new调用String()则会返回一个字符串对象

代码语言：javascript复制
let a = 100;
console.log(typeof String(a)); // string
console.log(typeof new String(a)); // object
console.log(new String(a).length); // 3

6、字符串对象

  • ES5常用方法

es5方法

描述

charAt()

返回在指定位置的字符

substring()

提取字符串中两个指定的索引号之间的字符

slice()

提取字符串的片断，并在新的字符串中返回被提取的部分

substr()

从起始索引号提取字符串中指定数目的字符

indexOf()

返回某个指定的字符串值在字符串中首次出现的位置

lastIndexOf()

从后向前搜索字符串，返回最后一次出现的索引

split()

把字符串分割为字符串数组

replace()

在字符串中查找匹配的子串， 并替换与正则表达式匹配的子串

concat()

拼接两个或更多字符串，并返回新的字符串

toUpperCase()

把字符串转换为大写

toLowerCase()

把字符串转换为小写

trim()

去除字符串两端的空格

实例代码：

代码语言：javascript复制
let s2 = "hello,javascript"
s2.charAt(0)  //返回下标为0的字符 h
s2.substring(1,4) // 截取索引为1-3的字符 ell
s2.slice(1,4)// 截取索引为1-3的字符 ell
s2.slice(-3) // 从后往前数3个，截取时从左至右  ipt
s2.substr(2,3) // 从2开始，截取3个 llo
s2.indexOf("l") //得到第一次出现的下标  2
s2.lastIndexOf("l") // 最后一次出现的索引  3
s2.indexOf("l",3) // 3表示第一次出现位置  3
s2.split(", ") //分割字符串  ["hello,javascript"]
s2.replace("s","S") // 原字符串不变化  "hello,javaScript"
s2.concat("!") //拼接  "hello,javascript!"
s2.toUpperCase() //大写  "HELLO,JAVASCRIPT"
" abc ".trim() //去除两端的空格  "abc"
  • ES6常用方法

es6方法

描述

charCodeAt()

返回在指定的位置的字符的 Unicode 编码

String.fromCharCode()

将 Unicode 编码转为字符

String.fromCodePoint()

静态方法返回使用指定的代码点序列创建的字符串

valueOf()

返回字符串对象的原始值

search()

用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，要执行忽略大小写的检索，追加 i。如果没有找到任何匹配的子串，则返回 -1

match()

用于查找字符串中指定的值，或找到一个或多个正则表达式的匹配，返回指定的值

startsWith()

查看字符串是否以指定的子字符串开头

endsWith()

查看字符串是否以指定的子字符串结尾

includes()

查找字符串中是否包含指定的子字符串

repeat()

复制字符串指定次数，并将它们连接在一起返回

padStart()

用另一个字符串填充当前字符串(如果需要的话，会重复多次)，以便产生的字符串达到给定的长度。从当前字符串的左侧（头部）开始填充。

padEnd()

用另一个字符串填充当前字符串(如果需要的话，会重复多次)，以便产生的字符串达到给定的长度。从当前字符串的右侧（末尾）开始填充。

实例代码：

代码语言：javascript复制
let s = String("u{20bb7}");
let c0 = s.charCodeAt(0)
let c1 = s.charCodeAt(1)
let point = s.codePointAt(0)
console.log(s); // ?
console.log(c0); // 55362 
console.log(c1); // 57271 
console.log(point); // 134071
console.log(String.fromCharCode(point)); // ஷ 
console.log(String.fromCharCode(c0, c1)); // ? 
console.log(String.fromCodePoint(point)); // ?
代码语言：javascript复制
let str = "123abcd45678EFG90"
console.log(str.valueOf()); // "123abcd45678EFG90"
console.log(str.match(/d/g)) // ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"]
console.log(str.search(/abc/)) // 3
代码语言：javascript复制
let s = "Hello JavaScript!"
console.log(s.startsWith("He")); // true
console.log(s.endsWith("pt!")); // true
console.log(s.includes("Ja")) // true
console.log(s.indexOf("aa")) // -1
console.log(s*2) // NaN
console.log(s.repeat(2)) // Hello JavaScript!Hello JavaScript!
console.log(s.repeat(0.2)) // 
console.log(s.repeat(1.9)) // Hello JavaScript!

let s2 = "Go"
console.log(s2.padStart(5, "JS")) // JSJGo
console.log(s2.padEnd(5, "JS")) // GoJSJ
console.log(s2.padStart(10, '01234567'))  //  01234567Go

7、需要注意的细节

7.1 示例1

代码语言：javascript复制
new String(100) == new String(100) 
String(100) == new String(100)

输出结果： false true

原因： 第一个，引用值比较的是它的引用，引用不同，所以结果为false 第二个，原始值与引用值相比较，引用值先要进行拆箱，才能进行比较

7.2 示例2

代码语言：javascript复制
let s = "This is a dog"
let str = s.slice(2, 6)
console.log(str);

输出结果： is i 这里的slice方法是截取小标为2-6的字符，不包括6。

  • 为什么这里能使用s.slice呢？ 原因： 这里的s是临时创建的一个包装对象（可以看成进行了一个new String的操作），所以可以使用s.slice方法，在调用完slice就消失掉了。
编程算法 java unicode 正则表达式 html

0 人点赞