Javascript字符串string

发表于 2016-03-23 更新于 2021-06-09

本文属于原创文章，转载请注明–来自桃源小盼聊技术

字符串是Javascript最常用的数据类型，是五种基本数据类型之一（其他是number, boolean, null, undefined)。
我们常用的是字符串字面量形式。

检测是否为字符串

typeof直接去检测是不准确的，通用的类型检测方法又太过繁琐。
而借助valueOf()方法，则可以返回一个字符串字面量。(此方式也适用于number与boolean)

var str1 = 'hello';
var str2 = new String('world');

typeof str1; // string
typeof str2; // object
typeof str2.valueOf(); // string

其他类型转换为字符串

大部分情况下调用toString()方法即可，然后null和undefined则需要使用String()方法。

var num = 1;
   num.toString();       // '1'
   var other = String(null) // 'null'

一元运算符和字符串

当一个字符串和其他类型相加时，其他类型会转换成字符串，再相加。
而如果是和其他类型做比较和减法运算时，字符串会转换成数字，再计算。

var str = '1';
   var num = 5;
   var boo = true;
   num - str;  // 4
   str == boo; // true

str.concat()

将一个或者多个字符串参数附加到字符串对象末尾，拼接成一个字符串。

  var str = 'Hello';
str.concat(' ', 'World'); // Hello World

然而最常用的还是’+’运算符。

var str = '5' '1';    // 51
var str2 = 5 + '1';   // 51
var num = 5 + (+'1'); // 6

当其他数据类型和字符串相加时，首先会被转换成字符串。
但是在数字字符串前面加入一个’+’运算符，将会把字符串转化为数字。

str.indexOf() 与 str.lastIndexOf()

在原始字符串中查找参数字符串，如果存在，则返回参数字符串索引位置。不存在返回-1。
第二个参数代表查找的起始位置。

var str = 'god is god';

str.indexOf('god');    // 0
str.indexOf('god', 4); // 7
str.indexOf('are');    // -1

lastIndexOf()则是从右向左搜索，第二个参数也是从右向左计数。

str.lastIndexOf('god');    // 7
str.lastIndexOf('god', 1); // 0

str.indexOf('god', 0);     // 0
str.lastIndexOf('god', 0); // 0

Javascript从右向左计算时，通常遵循左包括右不包括。

str.search()

在字符串中查找符合正则表达式的匹配项，如果匹配成功，返回首次匹配项的索引，否则返回-1。

var str = 'hello 123 world';
str.search(/\d/);    // 6
str.search(/china/); // -1

str.match()

参数为正则表达式对象，返回一个包含匹配结果的数组。

var str = '1 hello 2 world 3';
var arr = str.match(/\d/g); // [1, 2, 3]

str.replace()

语法

str.replace(regexp/substr, newstr/function)

用字符串替换匹配项，返回新字符串。
第一个参数可以是字符串或正则表达式对象。
第二个参数为替换字符串或者函数返回值。

var str = '1 hello 2 world 3';
var str2 = str.replace('world', 'china'); // '1 hello 2 china 3'
var str3 = str.replace(/\d/g, '88'); // '88 hello 88 china 88'

//函数四个参数分别为匹配项、p1正则表达式一个括号匹配项(p2为第二个括号匹配项，以此类推)、匹配项索引位置、原始字符串
//此方法将所有项打印出来看看
var str4 = str.replace(/(\d)/g, function(match, p1, offset, string){
    return '(match:' + match + '-p1:' + p1 + '-offset:' + offset + '-string:' + string + ')';
})
// '(match:1-p1:1-offset:0-string:1 hello 2 world 3) hello (match:2-p1:2-offset:8-string:1 hello 2 world 3) world (match:3-p1:3-offset:16-string:1 hello 2 world 3)'

str.slice()

语法

str.slice(start, end);

提取字符串中的一部分，参数为索引位置，第二个参数可选（默认为字符串长度）。
如果参数为负，自动被加上字符串长度计算。

var str = 'God is god';
var str2 = str.slice(0, 3);   // God
var str3 = str.slice(4);      // is god
var str4 = str.slice(-3, -1); // go

str.substring()

语法

str.substring(start, end)

此方法和slice()相似。只是如果参数为负数，则按照0计算。如果参数大于字符串长度，则按照str.length计算。

var str = 'God is god';
var str1 = str.substring(0, 3);  // God
var str2 = str.substring(-2, 3); // God
var str3 = str.substring(4);     // is god
var str4 = str.substring(7, 10); // god
var str5 = str.substring(7, 20); // god

str.substr()

语法

str.substr(start, length)

提取字符串中指定长度的子字符串。
第一个参数为起始索引位置，如果为负数，则自动被加上字符串长度计算。
第二个参数为截取的长度，可选的（默认字符串长度），如果为0或者负数，则返回空字符串。

var str = 'God is god';
var str1 = str.substr(0, 3);  // God
var str2 = str.substr(-3, 3); // god
var str3 = str.substr(3, -1); // ''
var str4 = str.substr(4);     // is god

str.split()

语法

str.split(sep, limit)

将一个字符串按照给定分隔符，分割为一个数组。
第一个参数为字符串或正则表达式，第二个参数限制数组长度。

var str = '1,2,3,4,5';
var arr = str.split(',');     // [1, 2, 3, 4, 5]
var arr2 = str.split(',', 3); // [1, 2, 3]
var arr3 = str.split(/,/);    // [1, 2, 3, 4, 5]

str.trim()

去除字符串两端的空白。

var str1 = ' hello ';
var str2 = ' hello';
var str3 = 'hello ';
var str4 = 'he llo';

str1.trim(); // hello
str2.trim(); // hello
str3.trim(); // hello
str4.trim(); // he llo

trim()不存在时的兼容代码

if (!String.prototype.trim) {
  String.prototype.trim = function () {
    return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
  };
}

str.charAt()

获取指定索引位置的字符。

var str = 'hello world';
str.charAt(0); // h
str.charAt(6); // w

str.charCodeAt()

获取指定索引位置字符的Unicode编码。

var str = 'hello wrold';
str.charCodeAt(0); // 104
str.charCodeAt(6); // 119

String.fromCharCode()

静态方法，根据指定的Unicode编码，返回响应的字符串。

String.fromCharCode(97,98,99); // abc

str.toUpperCase() 与 str.toLowerCase()

字符串大小写转换。

var str = 'hello china';
var str2 = 'HELLO WORLD';

str.toUpperCase();  // HELLO　CHINA
str2.toLowerCase(); // hello world

str.localeCompare()

字符串比较函数，如果原始字符串在词法上比参数字符串大，返回1，相等的话返回0，否则返回-1。
一般情况下使用比较运算符即可。

var str = 'abcd';
str.localeCompare('efgh'); // -1;
str.localeCompare('ABCD'); // 1

JSON.parse()

语法

JSON.parse(str, function(prop, val){});

将一个json字符串解析成为一个javascipt值;
第一个参数是json字符串。
第二个参数是一个解析函数，会把返回值覆盖原属性值，如果返回为undefined,则此属性从对象中删除。
函数中的两个参数分别为属性名和属性值。

var str = '{"oo" : 1, "pp" : "2"}';
var obj = JSON.parse(str);
// Object {oo: 1, pp: "2"}

var obj2 = JSON.parse(str, function(p, v){
    if( p === 'oo') {
        v = undefined;
    }
    return v;
});
//    Object {pp: "2"}

var obj3 = JSON.parse(str, function(p, v){
    return v + 5;
});
// [object object]5

第三个例子明显不是我们想要的结果。因为在遍历到最顶层的时候，传入到函数中的参数是空字符串。
重新改写第三个例子。

var obj3 = JSON.parse(str, function(p, v){
    if (p === '') {
        return v;
    }

    return v + 5;
});
// Object {oo: 6, pp: "25"}

JSON.stringify()

语法

JSON.stringify(value, function()/array, space);

将js值序列化成json字符串。
第一个参数可以是任何类型，但是非数组中的undefined会被忽略，数组中的undefined转化为null。
第二参数可以是函数或者数组，如果是函数，用法类型JSON.parse()。如果是数组，那么最终结果是数组中存在的值。
第三个参数是控制结果字符串的间距，如果是数字，则缩进对应数量空格。如果是字符串，则每个级别插入该字符串。（最多十位）

var obj = {oo : 1, pp : 2};
var str = JSON.stringify(obj);
// '{"oo":1,"pp":2}'

var str2 = JSON.stringify(obj, ['oo']);
// '{"pp":2}'

var str3 = JSON.stringify(obj, null, 'bili');
/* '{
    bili"oo": 1,
    bili"pp": 2
    }'
*/

var str4 = JSON.stringify(obj, null, 4);
/* '{
        "oo": 1,
        "pp": 2
    }'
*/