天天看点
返回

String整理笔记一，String 对象属性二，String对象方法13，match14，replace15，search三，String HTML 包装方法

一，String 对象属性

1，constructor   =>  string.construstor

constructor 属性返回对 String 对象属性创建的函数。 
实例
返回 String 对象属性创建的函数：

const txt = "Hello World!";
document.write(txt.constructor);

以上实例输出:
function String() { [native code] }


应用：
判断数据类型

"".construsctor   // undefined
"aaa".construsctor === String  // true

2，length  =>  string.length

length 属性返回字符串的长度(字符数)。 
实例
返回字符串的字符数:

const txt = "Hello World!";
document.write(txt.length); // 12

3，prototype  =>  object.prototype.name = value

prototype 属性允许您向对象添加属性和方法

注意： Prototype 是全局属性，适用于所有的 Javascript 对象。

实例
适用 prototype 属性给对象添加属性:

function employee(name,jobtitle,born){
    this.name=name;
    this.jobtitle=jobtitle;
    this.born=born;
}
const fred=new employee("Fred Flintstone","Caveman",1970);
employee.prototype.salary=null;
fred.salary=20000;
document.write(fred.salary); // 20000

二，String对象方法

1，chartAt  =>  string.chartAt(index)  

charAt() 方法可返回指定位置的字符。

第一个字符位置为 0, 第二个字符位置为 1,以此类推.

实例
返回字符串中的最后一个字符：

const str = "HELLO WORLD";
const n = str.charAt(str.length-1); // D

2，chartCodeAt  =>  string.chartCodeAt(index)

charCodeAt() 方法可返回指定位置的字符的 Unicode 编码，但是不可以识别大于0xFFFF的码点。ES6新增的codePointAt可以用于识别大于0xFFFF的码点

字符串中第一个字符的位置为 0， 第二个字符位置为 1，以此类推。

实例一
返回字符串中最后一个字符的 Unicode 编码:

const str = "HELLO WORLD";
const n = str.charCodeAt(str.length-1); // 68


实例二
"?"是一个需要4个字节存储的汉字

const a = "?c";
a.charCodeAt(0); // 返回前两个字节的值 55362
a.charCodeAt(1); // 返回后两个字节的值 57271 
a.charCodeAt(2); // 返回c的由此可见 99


实例三
codePointAt方法，能够正确处理 4 个字节储存的字符，返回一个字符的码点.
在第二个字符（即“?”的后两个字节）和第三个字符“c”上，codePointAt方法的结果与charCodeAt方法相同。

const a = "?c";
a.codePointAt(0); // 返回了该字的十进制码点 134071
a.codePointAt(1); // 返回后两个字节的值 57271 
a.codePointAt(2); // 返回c的由此可见 99

总结:

1, 上面代码中，字符c在字符串a的正确位置序号应该是 1，但是必须向codePointAt方法传入 2。解决这个问题的一个办法是使用for...of循环（ES6 为字符串添加了遍历器接口），这个遍历器最大的优点是可以识别大于0xFFFF的码点，传统的for循环无法识别这样的码点。因此for...of可以正确识别 32 位的 UTF-16 字符。
const a = '?c';
for (let ch of a) {
   // codePointAt()方法返回的是码点的十进制值，如果想要十六进制的值，可以使用toString方法转换一下。
   console.log(ch.codePointAt(0).toString(16));
}
// 20bb7
// 63

2, codePointAt方法是测试一个字符由两个字节还是由四个字节组成的最简单方法。
function is32Bit(c) {
return c.codePointAt(0) > 0xFFFF;
}
is32Bit("?") // true
is32Bit("a") // false

3，fromChartCode  =>  String.formChartCode()

fromCharCode() 可接受一个或多个指定的 Unicode 值，然后返回一个字符串。但是这个方法不能识别 32 位的 UTF-16 字符（Unicode 编号大于

0xFFFF

 ）。ES6 提供了

String.fromCodePoint()

 方法，可以识别大于

0xFFFF

 的字符，弥补了

String.fromCharCode()

 方法的不足。在作用上，正好与

codePointAt()

方法相反。

注意：该方法是 String 的静态方法，字符串中的每个字符都由单独的 Unicode 数字编码指定。

注意，

fromCodePoint()

 方法定义在

String

 对象上，而

codePointAt()

 方法定义在字符串的实例对象上。 
实例一
将 Unicode 编码转换为一个字符串:

const n = String.fromCharCode(72,69,76,76,79); // HELLO


实例二
String.fromCharCode()不能识别大于0xFFFF的码点，所以0x20BB7就发生了溢出，最高位2被舍弃了，最后返回码点U+0BB7对应的字符，而不是码点U+20BB7对应的字符。

String.fromCharCode(0x20BB7) // 实际执行的是String.fromCharCode(0x0BB7) 最高位被舍弃
// "ஷ"


实例三
如果String.fromCodePoint()方法有多个参数，则它们会被合并成一个字符串返回。

String.fromCodePoint(0x20BB7, 0x78)
// "?x"
String.fromCodePoint(0x78, 0x1f680, 0x79) === 'x\uD83D\uDE80y'
// true

4，concat  =>  string.concat(str1, str2, str3, ..., strx)

concat() 方法用于连接两个或多个字符串。

该方法没有改变原有字符串，但是会返回连接两个或多个字符串新字符串。

实例 
连接3个字符串:

const str1="Hello ";
const str2="world!";
const str3=" Have a nice day!";
const n = str1.concat(str2,str3); // Hello world! Have a nice day!

5，indexOf  lastIndexOf  includes startsWith endsWith

indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。

如果没有找到匹配的字符串则返回 -1。

注意： indexOf() 方法区分大小写。

string.lastIndexOf(searchvalue,start) 方法可返回一个指定的字符串值最后出现的位置，如果指定第二个参数 start，则在一个字符串中的指定位置从后向前搜索。

注意： 该方法将从后向前检索字符串，但返回是从起始位置 (0) 开始计算子字符串最后出现的位置。 看它是否含有字符串。

开始检索的位置在字符串的 start 处或字符串的结尾（没有指定 start 时）。

如果没有找到匹配字符串则返回 -1 。

注意：lastIndexOf() 方法是区分大小写的！

includes(searchElement, fromIndex) 方法用来判断一个数组或字符串是否包含一个指定的值，如果是则返回 true，否则false。

如果找到匹配的字符串则返回 true，否则返回 false。

searchElement 必须 传入的value值 

fromIndex 可选。从该索引处开始查找 searchElement。如果 fromIndex 为负值，计算出的索引将作为开始搜索searchElement的位置。如果计算出的索引小于 0，则整个数组或字符串都会被搜索。

注意： includes() 方法区分大小写。

string.startsWith(searchValue, start) 方法用于检测字符串是否以指定的子字符串开始。(string.endWith(searchValue, start)与之相反)

如果是以指定的子字符串开头返回 true，否则 false。

searchValue 必需，要查找的字符串。

start 可选，查找的开始位置，默认为 0。

注意：startsWith() 方法对大小写敏感。

实例一
查找字符串 "welcome" 出现的位置:

const str="Hello world, welcome to the universe.";
const n=str.indexOf("welcome"); // 13


实例二
查找字符串 "runoob" 最后出现的位置:

const str="I am from runoob，welcome to runoob site.";
const n=str.lastIndexOf("runoob"); // 28


实例三
// 数组长度是3
// fromIndex 是 -100
// computed index 是 3 + (-100) = -97
 
const arr = ['a', 'b', 'c'];
const str = "abc";
 
arr.includes('a', -100); // true
arr.includes('b', -100); // true
str.includes('c', -100); // true


实例四
const str = "Hello world, welcome to the Runoob.";
const n = str.startsWith("world", 6); // true

6，repeat

repeat() 方法字符串复制指定次数。 
实例
复制字符串 "Runoob" 两次:

const str = "Runoob";
str.repeat(2); // RunoobRunoob str被重复了2次返回，str不改变
str.repeat(2.6); // RunoobRunoob 浮点类型参数，会取整重复
str.repeat(0); // "" 0的时候返回空字符串
str.repeat(-3); // 负数，报错
str.repeat(undefined); // "" undefined转化为0
str.repeat(null); // "" null转化为0
str.repeat(NaN); // "" NaN转化为0

7，slice substr substring

slice(start, end) 方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。

使用 start（包含） 和 end（不包含） 参数来指定字符串提取的部分。

字符串中第一个字符位置为 0, 第二个字符位置为 1, 以此类推。

提示： 如果是负数，则该参数规定的是从字符串的尾部开始算起的位置。也就是说，-1 指字符串的最后一个字符，-2 指倒数第二个字符，以此类推。

substr(start, length) 方法可在字符串中抽取从 开始 下标开始的指定数目的字符。

提示： substr() 的参数指定的是子串的开始位置和长度，因此它可以替代 substring() 和 slice() 来使用。

在 IE 4 中，参数 start 的值无效。在这个 BUG 中，start 规定的是第 0 个字符的位置。在之后的版本中，此 BUG 已被修正。

ECMAscript 没有对该方法进行标准化，因此反对使用它。

注意： substr() 方法不会改变源字符串。

substring(from, to) 方法用于提取字符串中介于两个指定下标之间的字符。

substring(from, to) 方法返回的子串包括 开始 处的字符，但不包括 结束 处的字符。

from 必需。一个非负的整数，规定要提取的子串的第一个字符在 string Object 中的位置。

to 可选。一个非负的整数，比要提取的子串的最后一个字符在 string Object 中的位置多 1。

如果省略该参数，那么返回的子串会一直到字符串的结尾。

实例
从字符串的第3个位置到第8个位置直接的字符串片段:

const str = "Hello world!";
const n = str.slice(3,8); // lo wo
const n = str.slice(0, -3); // Hello wor


实例
从字符串第二个位置中提取一些字符：
const str = "Hello world!";
const n = str.substr(2); // llo world!


实例
从字符串中提取一些字符：:

const str = "Hello world!";
document.write(str.substring(3) + "<br>"); // lo world!
document.write(str.substring(3, 7)); // lo w

8，split

split(separator, limit) 方法用于把一个字符串分割成字符串数组。

separator 可选。字符串或正则表达式，从该参数指定的地方分割 string Object

limit 可选。该参数可指定返回的数组的最大长度。如果设置了该参数，返回的子串不会多于这个参数指定的数组。如果没有设置该参数，整个字符串都会被分割，不考虑它的长度。

提示： 如果把空字符串 ("") 用作 separator，那么 stringObject 中的每个字符之间都会被分割。

注意： split() 方法不改变原始字符串。结合正则使用更强大

实例一
分割每个字符，包括空格:

const str="How are you doing today?";
const n=str.split("", 5);
document.write(n); // H,o,w, ,a
document.write(n.length); // 5
document.write(n.constructor === Array); // true


实例二
使用正则表达式，去除了子字符串的逗号后面的空格。

// 非正则分隔
'a,  b,c, d'.split(',')
// [ 'a', '  b', 'c', ' d' ]

// 正则分隔，去除多余的空格
'a,  b,c, d'.split(/, */)
// [ 'a', 'b', 'c', 'd' ]

// 指定返回数组的最大成员
'a,  b,c, d'.split(/, */, 2)
[ 'a', 'b' ]

9，toLowerCase()  toUpperCase()  toLocaleLowerCase()  toLocaleUpperCase()

toLowerCase() 方法用于把字符串转换为小写。
toUpperCase() 方法用于把字符串转换为大写。

toLocaleLowerCase() 方法根据本地主机的语言环境把字符串转换为小写。

本地是根据浏览器的语言设置来判断的。

通常，该方法与 toLowerCase() 方法返回的结果相同，只有几种语言（如土耳其语）具有地方特有的大小写映射。

注意: toLocaleLowerCase() 方法没有改变原始字符串。

提示: 使用 toLocaleUpperCase() 方法根据本地主机的语言将字符串转换为大写。

toLocaleUpperCase() 方法根据本地主机的语言环境把字符串转换为大写。

本地是根据浏览器的语言设置来判断的。

通常，该方法与 toUpperCase() 方法返回的结果相同，只有几种语言（如土耳其语）具有地方特有的大小写映射。

注意: toLocaleUpperCase() 方法没有改变原始字符串。

提示: 使用 toLocaleUpperCase() 方法根据本地主机的语言将字符串转换为大写。

实例
把字符串转换为小写:

const str="Runoob";
document.write(str.toLowerCase()); // runoob


实例
把字符串转换为大写:

const str="Runoob";
document.write(str.toUpperCase()); // RUNOOB


实例
将字符串转换为小写:

const str = "Runoob";
const res = str.toLocaleLowerCase(); // runoob


实例
将字符串转换为大写:

const str = "Runoob";
const res = str.toLocaleUpperCase(); // RUNOOB

10，trim => str.trim()

trim() 方法用于删除字符串的头尾空格。

trim() 方法不会改变原始字符串。

实例
去除字符串的头尾空格:

const str = "       Ru  noob        ";
document.write(str.trim()); // Ru  noob

11，valueOf  =>  string.valueOf()

valueOf() 方法可返回 String 对象的原始值。

注意： valueOf() 方法通常由 JavaScript 在后台自动进行调用，而不是显式地处于代码中。

实例
返回 String 对象的原始值:

const str="Hello world!";
document.write(str.valueOf()); // Hello world!

12，toString  =>  string.toString()  String()

toString() 方法返回一个表示 String 对象的值。与String(value)类似 
实例
返回一个 String 对象的值:

const str = "Runoob";
const res = str.toString(); // "Runoob" 不可以是null或underfined

13，match

match() 方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。以找到一个或多个与 regexp 匹配的文本。这个方法的行为在很大程度上有赖于 regexp 是否具有标志 g。如果 regexp 没有标志 g，那么 match() 方法就只能在 stringObject 中执行一次匹配。如果没有找到任何匹配的文本， match() 将返回 null。否则，它将返回一个数组，其中存放了与它找到的匹配文本有关的信息。结合正则使用更强大 
实例
下面代码中，字符串s含有一个换行符，点号不包括换行符，所以第一个正则表达式匹配失败；第二个正则表达式[^]包含一切字符，所以匹配成功。

const s = 'Please yes\nmake my day!';

s.match(/yes.*day/) // null
s.match(/yes[^]*day/) // [ 'yes\nmake my day']

14，replace

replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。该方法不会改变原字符串。结合正则使用更强大 
实例

'aaa'.replace('a', 'b') // "baa"
'aaa'.replace(/a/, 'b') // "baa"
'aaa'.replace(/a/g, 'b') // "bbb"

应用：
replace方法的一个应用，就是消除字符串首尾两端的空格。

const str = '  #id div.class  ';

str.replace(/^\s+|\s+$/g, '')
// "#id div.class"

15，search

search() 方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。

如果没有找到任何匹配的子串，则返回 -1。结合正则使用更强大

实例

'_x_x'.search(/x/)
// 1

三，String HTML 包装方法

注释：HTML 返回包含在相对应的 HTML 标签中的内容。以下方法并非标准方法，所以可能在某些浏览器下不支持。

1，anchor()  => string.anchor(name)

anchor() 方法用于创建 HTML 锚。

该方法返回加了 <a> 标签的字符串, 如下所示:

<a name="anchorname">string</a>

实例
创建 HTML 锚：

const txt = "Chapter 10";
txt.anchor("chap10");
alert(txt.anchor("chap10"));

2，big()

strike() 方法用于显示加删除线的字符串。

该方法返回加了 <strike> 标签的字符串, 如下所示:

<strike>string</strike>

big() 方法用于把字符串显示为大号字体。

该方法返回加了 <big> 标签的字符串, 如下所示:

<big>string</big>

document.write(str.big());

3，blink()

blink() 方法用于显示闪动的字符串。目前只有 Firefox 和 Opera 浏览器支持 blink() 方法. Internet Explorer, Chrome, 以及 Safari 不支持 blink() 方法。

该方法返回加了 <blink> 标签的字符串, 如下所示:

<blink>string</blink>

document.write(str.blink());

4，bold()

bold() 方法用于把字符串显示为粗体。

该方法返回加了 <b> 标签的字符串, 如下所示:

<b>string</b>

document.write(str.bold());

5，fixed()

fixed() 方法用于把字符串显示为打字机字体。

该方法返回加了 <tt> 标签的字符串, 如下所示:

<tt>string</tt>

document.write(str.fixed());

6，fontcolor(color)

fontcolor() 方法用于按照指定的颜色来显示字符串。

该方法返回加了 <font> 标签的字符串, 如下所示:

<font color="colorvalue">string</font>

color 必需。为字符串规定 font-color。该值必须是颜色名(red)、RGB 值(rgb(255,0,0))或者十六进制数(#FF0000)。

document.write(str.fontcolor("red"));

7，fontsize(size) 

size 必须. size 参数必须是从 1 至 7 的数字。 
document.write(str.fontsize(1));

8，italices() 

italics() 方法用于把字符串显示为斜体。

该方法返回加了 <i> 标签的字符串, 如下所示:

<i>string</i>

document.write(str.italics());

9，link(src) 

link() 方法用于把字符串显示为超链接。

该方法返回加了 <a> 标签的字符串, 如下所示:

<a href="url" target="_blank" rel="external nofollow" >string</a>

document.write(str.link("http://www.w3cschool.cc"));

10，small()

small() 方法用于把字符串显示为小号字。

该方法返回加了 <small> 标签的字符串, 如下所示:

<small>string</small>

document.write(str.small());

11，strike()

strike() 方法用于显示加删除线的字符串。

该方法返回加了 <strike> 标签的字符串, 如下所示:

<strike>string</strike>

document.write(str.strike());

12，sub() 

sub() 方法用于把字符串显示为下标。

该方法返回加入 <sub> 标签的字符串，如下所示：

<sub>string</sub>

document.write(str.sub());

13，sup() 

sup() 方法用于把字符串显示为上标。

该方法返回加入 the <sup> 标签的字符串, 如下:

<sup>string</sup>

document.write(str.sup());
string String整理
上一篇: Navicat获取数据库表字段
下一篇: 入行月薪12k，我是怎么转行成为软件测试工程师的

继续阅读