ES6 学习笔记(六)基本类型String

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

本文最后更新于 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就消失掉了。

0 人点赞