JavaScript的String

DangoSky 发布于2019-08-22 15:45 / 2841人阅读

摘要：如果小于的长度，那返回拼接的字符串用拼在前面以达到的长度，如果必要的话，重复参数目标长度。如果小于的长度，那么返回用来拼接的字符串。的值为统一化这个方法把给定的统一为特定的某种格式。

String作为JS里面最常用的数据类型，我好像没有好好地总结过，所以偶尔有些不常用的，细节的知识点还是不是100%的自信，希望写篇文章来巩固一下。文章主要分为一下几部分：

1：创建一个字符串的3种方法以及区别
2：字符串的常用属性
3：字符串的常用方法
4：一些易犯的错误

接下来就从前到后来梳理一下：

1：创建一个字符串的3种方法以及区别

创建一个字符串的常用方法有：

1: let a = "x"; //字符串字面量的方式
2: let b = String("x"); //利用全局的String对象生成
3: let c = new String("x"); //创建一个String对象

以上的三种方法中，第三种是创建了一个对象，第一种和第二种都是创建一个string类型的数据，如果对a,b,c分别调用typeof结果为：

typeof a; //"string"
typeof b; //"string"
typeof b; //"object"

我们暂且把以上的第一种和第二种叫‘原始字符串’，把第三种叫做‘字符串对象’。原始字符串和字符串对象在遇到eval()方法的时候，也表现得不一样：

eval(new String("2 + 2")); // returns a String object containing "2 + 2"
eval("2 + 2");             // returns 4

当然我们可以对字符串对象调用valueOf方法，得到其对应的原始字符串：

eval(new String("2 + 2").valueOf()); // returns 4

2：字符串的常用属性

1: length
通俗地说，length属性返回一个字符串的字符个数，JavaScript采用UTF-16编码，实际上length属性就是返回一个字符串有多少个UTF-16编码。

 ‘abcd’.length; //4

3: 字符串的常用方法

1: 获取字符串特定位置的字符

1：string.charAt(index); //返回某位的字符
2：string.charCodeAt(index); //返回某位上的字符的utf-16编码
3：string.codePointAt(pos); //返回某位上的Unicode point值

example:

1: "ABC".charAt(0); // 65
2: "ABC".charCodeAt(0); //65
3: "ABC".codePointAt(0); //65
4: "uD800uDC00".codePointAt(0); // 65536

2: 字符串拼接

1：string.concat(string1[, string2, ..., stringN]);

    1: 返回一个新字符串，此方法对原字符串没有影响
    2: 非string类型的参数会先转为string类型再拼接

example:

1: "abc".concat("xx"); //"abcxx"
2: "".concat(...["a", "b", "c"]); //"abc"
3: "".concat([]): //""
4: "".concat(true); // "true"
5: "".concat(4, 5); //"45"

2：string.padEnd(targetLength, padString)

用padString拼在string的后面达到targetLength的长度，如果有必要的话会重复padString
参数：

targetLength: 目标长度。如果小于string的长度，那返回string
padString: 拼接的字符串

example:

1: "abc".padEnd(1); // "abc"
2: "abc".padEnd(7, "foo"); "abcfoof"

3： string.padStart(targetLength, padString)

用padString拼在string前面以达到targetLength的长度，如果必要的话，重复padString
参数：

targetLength: 目标长度。如果小于string的长度，那么返回string
padString: 用来拼接的字符串。如果省略，则用空字符串。

example：

1: "abc".padStart(7, "foo"); //"foofabc"
2: "abc".padStart(1);// "abc"
3: "abc".padStart(7); "    abc"

4: string.repeat(count)

对string重复count次数之后返回一个新字符串
参数：

count: 重复的次数
count必须是0到正无穷之间的有限的次数，负数或者无穷大的数会抛出exception；如果count是0，则返回空字符串

example:

1: "abc".repeat(2); // "abcabc"
2: "abc".repeat(0); //""
3: "abc".repeat(-1);// Uncaught RangeError: Invalid count value
4: "abc".repeat(1/0);//Uncaught RangeError: Invalid count value

3: 逻辑判断的方法

1：string.endsWith(subString, length);  //是否以xx结束?

参数：

subString: 子字符串
length: 原字符串某个位置作为尾部（字符串第一位是1，不是0)。length可以省略。

example:

1: "abcd".endsWith("d"); //true
2: "abcd".endsWith("b"); //fasle
3: "abcd".endsWith("b", 2); //true

2: string.includes(subString, index); //是否包含xx?

参数：

subString: 是否包含的子字符串
index: 从元字符串的那个位置开始（第一位是0， 不是1）

example：

1: "abcd".includes("a"); // true
2: "abcd".includes("a", 1); // false
3: "abcd".includes("a", 0);// true

4: 返回数字的方法

1：string.indexOf(subString, fromIndex); 
返回第一次遇到substring的位置，如果找不到，返回-1

参数：

subString:要查找的子字符串
fromIndex:从原字符串哪个位置开始找，默认从0开始

example:

1: "abcdefg".indexOf("d"); // 3
2: "abcdefg".indexOf("d", 3); // 3
3: "abcdefg".indexOf("d", 4); // -1

2: string.lastIndexOf(subString, fromIndex)
返回最后一次遇到subString的坐标，找不到的话返回-1

参数：

subString:要查找的子字符串
fromIndex:从哪个坐标开始往后（backwards）找，默认为最后一位的坐标（string.length -1）.

example:

1: "012345".lastIndexOf("3", 2); // -1
2: "012345".lastIndexOf("3", 3); // 3
3: "012345".lastIndexOf("3", 5); // 3

5：比较

1：string.localeCompare(string2[,locales[, options]])
string与string2比较，如果string在string2前面则返回负数，后面则返回正数，相等返回0。

locale是场所，区域的意思，所以localeCompare是在特定场合（不同的语言等）下的比较。这些特定的场合可以由参数locales和options设置。
关于localeCompare请参考MDN

6：匹配

1：string.match(regexp);

参数：
regexp: 正则表达式。

如果没有此参数的话，match()会返回一个空Array([])。
如果给了此参数，string有匹配的话，会返回一个Array, 第一个元素是匹配到的完整字符串，接下来的项是匹配大括号里面的内容得到到的结果。
example:

var str = "For more information, see Chapter 3.4.5.1";
var re = /see (chapter d+(.d)*)/i;
var found = str.match(re);
found的值为：["see Chapter 3.4.5.1", "Chapter 3.4.5.1", ".1", index: 22, input: "For more information, see Chapter 3.4.5.1", groups: undefined]

7: 统一化

1：string.normalize([form])

这个方法把给定的string,统一为特定的某种Unicode格式。

背景：Unicode允许你对同一个字符采用不用的字节来编码，如果遇到某些需要根据字节来比较的情况，那对于不同编码方式的字符，那这时候就会出问题。所以，对于这种情况，可以先把字符都转为统一的编码方式再比较。
参数：form
form可选的值有: "NFC", "NFD", "NFKC", "NFKD", 分别的意思是：

NFC: Normalization Form Canonical Composition
NFD: Normalization Form Canonical Decomposition
NFKC: Normalization Form Compatibility Composition
NFKD: Normalization Form Compatibility Decomposition

其中：

Composition（NFC和NFKC）用尽可能少的字节来代表字符
Decomposition（NFD和NFKD）用字符拆开，用每一部分来代码字符。例如á被分解为a和´
Canonical (NFC和NFD)把连字作为单个字符，比如œ
Compatibility (NFKC和NFKD)把连字拆分开，比如œ被拆分为o+e

example:

var str = "u1E9Bu0323";
str.normalize("NFD"); // "u017Fu0323u0307"
str.normalize("NFKC"); // "u1E69"

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/93725.html

在 javascript 中，为什么 [1,2] + [3,4] 不等于 [1,2,3,4]？

摘要：但是在使用运算符时，在这两种情况下的工作方式是不同的。在中，数组不是基本类型，它的存在仅仅是一个糖衣语法，它其实是类的实例。然而，对于算数运算符和表现的为数字。课外作业检查其他的浏览器兼容性。在 stackoverflow 上有人提问：arrays - Why does [1,2] + [3,4] = 1,23,4 in JavaScript? 问题我想将一个数组追加到另一个数...

MRZYD 2019-08-19 14:20 评论0 收藏0
在 javascript 中，为什么 [1,2] + [3,4] 不等于 [1,2,3,4]？

摘要：但是在使用运算符时，在这两种情况下的工作方式是不同的。在中，数组不是基本类型，它的存在仅仅是一个糖衣语法，它其实是类的实例。然而，对于算数运算符和表现的为数字。注意用户自定义对象进行运算不一定总产生一个字符串结果。问题我想将一个数组追加到另一个数组的后面，于是我在 firebug 编写如下代码： [1,2] + [3,4] 但是，出乎意料，它却输出了： 1,23,4 而没有输出我期...

sydMobile 2019-08-21 17:37 评论0 收藏0
在 V8 中从 JavaScript 到 C++ 的类型转换

摘要：本文转载自众成翻译译者乱发小生链接原文学习怎样传递信息从到是一个非常难的事情。原因在于和两种语言类型之间的巨大差异。你可以在这里查看所有的类型。这两个组件松散和严格的表明一系列函数接收不同类型的参数，，，和和它们的返回值。本文转载自：众成翻译译者：乱发小生链接：http://www.zcfy.cc/article/3360原文：https://nodeaddons.com/type-...

betacat 2019-08-20 18:54 评论0 收藏0
Effective JavaScript读书笔记（一）

摘要：如果为假值，不传或者传入，函数都会返回但是，传入这个值是完全有可能的，所以这种判断形势是不正确的或者使用来判断也可以原始类型优于封装类型对象拥有六个原始值基本类型布尔值，数字，字符串，，和对象。作为一个前端新人，多读书读好书，夯实基础是十分重要的，正如盖楼房一样，底层稳固了，才能越垒越高。从开始学习到现在，基础的读了红宝书《JavaScript高级程序设计》，犀牛书《JavaScri...

zhoutao 2019-08-21 17:35 评论0 收藏0
怪异的JavaScript系列(三)

摘要：本文的思想源自于在上的演讲。我收集这些例子的主要目的是将它们整理并清楚理解它们的原理。着主要是因为大括号也是函数定义语法的一部分。自从年双十一正式上线，累计处理了亿错误事件，得到了金山软件等众多知名用户的认可。译者按： JavaScript有很多坑，经常一不小心就要写bug。原文: What the f*ck JavaScript? 译者: Fundebug 为了保证可读性...

XboxYan 2019-08-22 16:44 评论0 收藏0
从 JavaScript 到 TypeScript

摘要：能够根据返回语句自动推断出返回值类型，因此我们通常省略它。定义的函数类型接口就像是一个只有参数列表和返回值类型的函数定义。可索引类型具有一个索引签名，它描述了对象索引的类型，还有相应的索引返回值类型。 showImg(https://segmentfault.com/img/remote/1460000010018621?w=640&h=280); 本文首发在我的个人博客：http:/...

roundstones 2019-08-20 17:42 评论0 收藏0