Fork me on GitHub

String笔记

前言

上一篇做了一下数组的总结,在总结的过程中重新巩固了对数组的方法的使用,很多以前没记住的细节也一一捡了起来,这一篇Sring笔记也是为了重新复习下String的相关定义和用法。

原生对象String

1 JavaScript的原生对象String
关于String作为原生对象和构造函数的区别,上一篇数组有过详细的解析。这里就直接开始分析这两种情况下的String的使用。

属性和方法使用

length属性

这里的length属性只是String对象本身的length属性,其值为1

name属性

name属性返回String对象名称。与length属性一样,其值为String

fromCharCode()方法

  1. 一个参数:
    • 要转换的数据
  2. 用法:返回使用指定的Unicode值序列创建的字符串。
    1
    2
    String.fromCharCode(98,99,100);
    // "bcd"

注意:作用于高位编码,返回简单的高位编码的字符串,例如阿拉伯数字等等。

fromCodePoint()方法。

  1. 一个参数:
    • 要转换的数据
  2. 用法:返回使用指定的代码点序列创建的字符串。
    1
    2
    3
    4
    String.fromCodePoint(0x2F804);
    // "你"
    String.fromCharCode(0x2F804);
    // ""

注意:String.fromCodePoint()ES6的新方法,被用来返回一对低位编码,从而可以完全表示这些高位编码字符。

函数String

创建规范

字符串可以通过3个方式创建,字面量方式,String方法转化,以及String构造函数创建。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
let str = "12";
let str2 = String("13");
console.log(typeof(str));
console.log(typeof(str2));
str.__proto__ === String.prototype;
str2.__proto__ === String.prototype;
// string
// string
// true
// true

let str1 = new String("12");
console.log(typeof(str1));
str1.__proto__ === String.prototype;
// object
// true

  1. 字面量方式创建的字符串和String方法转化的字符串都是基本字符串。这些基本字符串没有属性和方法。而通过String构造函数创建的实例对象都是字符串对象,它继承String原型的上的属性和方法。
  2. 当基本字符串需要调用一个字符串对象才有的方法或者查询值的时候(基本字符串是没有这些方法的),JavaScript会自动将基本字符串转化为字符串对象并且调用相应的方法或者执行查询。

实例方法(es5)

通过构造函数new String创建的实例对象,它们的__proto__属性都是指向了String构造函数的原型对象,就继承了原型对象上的属性和方法。

String.prototype.

charAt()方法

  1. 一个参数:
    • index 字符串的索引,取值为整数。(0~length-1)。
      1. 传入非数字或者不传则默认取索引为0的字符。
      2. 传入的数值大于取值范围(0~length-1),返回空字符串。
  2. 用法:方法从一个字符串中返回指定索引的字符。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    let str = "123";
    console.log(str.charAt(0));
    console.log(str.charAt(1));
    console.log(str.charAt(2));
    console.log(str.charAt());
    console.log(str.charAt("0"));
    console.log(str.charAt(5));
    // 打印结果
    1
    2
    3
    1
    1
    ""

concat()方法

  1. 多个参数:
    • string1string2... 和原字符串连接的多个字符串。
  2. 用法:方法将一个或多个字符串与原字符串连接合并,形成一个新的字符串并返回。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    let str1 = "hello";
    let str2 = "world";
    let str3 = str1 + str2;
    let str4 = str1.concat(str2);
    console.log(str1);
    console.log(str3);
    console.log(str4);
    let str5 = `${str1}:${str2}`
    console.log(str5);

    // 打印结果
    "hello"
    "helloworld"
    "helloworld"
    "hello:world"

注意:

  1. 性能上字符串拼接性能高于使用concat方法。
  2. ES6的模板字符串拼接方便与其他未声明的字符串拼接。

indexOf()方法

  1. 两个个参数:
    • string
      指定查询的字符串。
    • index
      1. 表示调用该方法的字符串中开始查找的位置,取值为整数,默认值为0
      2. 查找的值是非空字符串。
        • index < 0 与传入默认值0返回结果一致。
        • 如果index >= str.length,则该方法返回-1
      3. 查找的值是空字符串。
        • index <= 0 时返回0
        • 0 < index <= str.length时返回index的值。
        • index > str.length时返回str.length
  2. 用法:方法返回调用String对象中第一次出现的指定值的索引,如果未找到该值,则返回-1。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    let str = "this is a question";
    let findStr = "question";
    let emptyStr = "";
    console.log(str.indexOf(findStr));
    console.log(str.indexOf(findStr, -1));
    console.log(str.indexOf(findStr, 20));
    console.log(str.indexOf("answer"));

    console.log(str.indexOf(emptyStr, -1));
    console.log(str.indexOf(emptyStr, 15));
    console.log(str.indexOf(emptyStr, 20));
    // 打印结果
    10
    10
    -1
    -1
    0
    15
    18

lastIndexOf()方法

  1. 两个个参数:
    • string
      指定查询的字符串。
    • index
      1. 表示调用该方法的字符串中开始查找的位置,取值为整数,默认值为str.length
      2. 查找的值是非空字符串
        • index < 0index = 0
        • 如果 index > str.length,则index = str.length
      3. 查找的值是空字符串
        • index <= 0 时返回0
        • 0 < index <= str.length时返回index的值。
        • index > str.length时返回str.length
  2. 用法:方法返回指定值在调用该方法的字符串中最后出现的位置,如果没找到则返回-1。从该字符串的后面向前查找,从index处开始。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    let str = "this is a question";
    let findStr = "question";
    let emptyStr = "";
    console.log(str.lastIndexOf(findStr));
    console.log(str.lastIndexOf(findStr, 20));
    console.log(str.lastIndexOf(findStr, -1));
    console.log(str.lastIndexOf("answer"));

    console.log(str.lastIndexOf(emptyStr, -1));
    console.log(str.lastIndexOf(emptyStr, 15));
    console.log(str.lastIndexOf(emptyStr, 20));
    // 打印结果
    10
    10
    -1
    -1
    0
    15
    18

slice()方法

  1. 两个个参数:
    • beginIndex
      1. 开始提取字符串的索引位置,取值为整数。
      2. 如果为负数,则beginIndex = str.length + beginIndex;
      3. 如果省略该参数,beginIndex = 0
    • endIndex
      1. 结束提取字符串的索引位置,取值为整数。
      2. 如果endIndex < 0,则endIndex= str.length + endIndex;
      3. 如果endIndex > str.length - 1slice会一直提取到字符串末尾。
      4. 如果省略该参数,slice会一直提取到字符串末尾
  2. 用法:方法提取一个字符串的一部分,并返回一新的字符串。提取的新字符串包括beginIndex但不包括endIndex
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    let str = "xiaohei like play basketball";
    console.log(str.slice());
    console.log(str.slice(0, 50));
    console.log(str.slice(-3));
    console.log(str.slice(0, -9));
    // 打印结果
    "xiaohei like play basketball"
    "xiaohei like play basketball"
    "all"
    "xiaohei like play b"

split()方法

  1. 两个参数:
    • separator
      1. 指定表示每个拆分应发生的点的字符串。
      2. 如果省略,会返回有含有整个字符串元素的数组;
      3. 如果分隔符为空字符串,则将原字符串中每个字符的数组形式返回。
    • limitNumber
      1. 指定分割后返回数组的元素个数,取值为整数。
      2. 如果limitNumber< 0,则返回全部被分割的元素组成的数组;
      3. 如果limitNumber大于当前被分割的元素个数,则返回全部被分割的元素组成的数组。
      4. 如果limitNumber小于当前被分割的元素个数,则返回limitNumber个数的元素组成的数组。
      5. 如果省略该参数,则返回全部被分割的元素组成的数组。
  2. 用法:方法使用指定的分隔符字符串将一个String对象分割成字符串数组,以将字符串分隔为子字符串,以确定每个拆分的位置。不改变原有字符串。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    let str = "asd,12,2,321,21"
    console.log(str.split(",", 0));
    console.log(str.split(",", -1));
    console.log(str.split(","));
    console.log(str.split(",", 3));
    console.log(str.split(",", 6));

    let str1 = "today is sunday";
    console.log(str1.split());
    console.log(str1.split(""));

    //打印结果
    []
    ["asd", "12", "2", "321", "21"]
    ["asd", "12", "2", "321", "21"]
    ["asd", "12", "2"]
    ["asd", "12", "2", "321", "21"]

    ["today is sunday"]
    ["t", "o", "d", "a", "y", " ", "i", "s", " ", "s", "u", "n", "d", "a", "y"]

substring()方法

  1. 两个参数:
    • startIndex
      1. 截取字符串开始的索引,为一个整数。
      2. startIndex = endIndex,返回一个空字符串。
      3. startIndex > endIndexstartIndex = endIndexendIndex = startIndex
      4. startIndex < 0或者startIndex = NaN, 则startIndex = 0
      5. startIndex > str.length - 1startIndex = str.length - 1
    • endIndex
      1. 截取字符串结束的索引,为一个整数。
      2. endIndex < 0或者endIndex=NaN, 则endIndex=0
      3. endIndex >str.length - 1endIndex= str.length - 1
  2. 用法:方法返回一个字符串在开始索引到结束索引之间字符串。不改变原有字符串。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    let str = "qwertydf";
    console.log(str.substring());
    console.log(str.substring(1, 1));
    console.log(str.substring(-1, 3));
    console.log(str.substring(-1, 20));
    console.log(str.substring(6, 0));

    // 打印结果
    "qwertydf"
    ""
    "qwe"
    "qwertydf"
    "qwerty"

toUpperCase()方法,toLocaleUpperCase()方法

toUpperCase()方法将调用该方法字符串值转换为大写形式,并返回。

toLocaleUpperCase()方法使用本地化locale-specific的大小写映射规则将输入的字符串转化成大写形式并返回结果字符串。

  1. 参数:无。
  2. 用法:两个方法绝大多数情况下返回结果一致,对于一些特殊的语言会返回不同,(日常使用中没啥区别)。都不会改变原来字符串。
    1
    2
    3
    let str = "helloworld, HI";
    str.toLocaleUpperCase(); // HELLOWORLD, HI
    str.toUpperCase(); // HELLOWORLD, HI

toLowerCase()方法,toLocaleLowerCase()方法

toLowerCase()方法将调用该方法的字符串值转换为小写形式,并返回。

toLocaleLowerCase()方法使用本地化locale-specific的大小写映射规则将输入的字符串转化成小写形式并返回结果字符串。

  1. 参数:无。
  2. 用法:两个方法绝大多数情况下返回结果一致,对于一些特殊的语言会返回不同,(日常使用中没啥区别)。都不会改变原来字符串。
    1
    2
    3
    let str = "helloworld, HI";
    str.toLocaleLowerCase(); // helloworld, hi
    str.toLowerCase(); // helloworld, hi

valueOf()方法,toString()方法

valueOf():字符串或者字符串对象调用该方法返回的该字符串的基本字符串格式。

toString():字符串或者字符串对象调用该方法返回的该字符串的基本字符串格式。

  1. 参数:无。
  2. 用法:上文中提到了字符串的两个基本格式,基本字符串和字符串对象,而基本字符串在使用实例方法时,JavaScript会把它转化成字符串对象后再调用方法。所以无论是基本字符串还是字符串对象调用这两个方法,本质上是没有区别的。valueOf()方法通常在JavaScript内部被调用,而不是在代码里显示调用。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    let baseStr = "baseString";
    let objStr = new String("objectString");
    console.log(baseStr.toString());
    console.log(objStr);
    console.log(objStr.valueOf());

    // 打印结果
    "baseString"
    String {0: "o", 1: "b", 2: "j", 3: "e", 4: "c", 5: "t", 6: "S", 7: "t", 8: "r", 9: "i", 10: "n", 11: "g"}
    "objectString"

trim()方法

  1. 参数:无。
  2. 用法:方法会从一个字符串的两端删除空白字符。方法并不影响原字符串本身。
    1
    2
    3
    let str = "test";
    console.log(str.trim()); // test
    console.log(str); // test

实例方法(ES6)

通过构造函数new String创建的实例对象,它们的__proto__属性都是指向了String构造函数的原型对象,就继承了原型对象上的属性和方法。

String.prototype.

includes()方法

  1. 参数:两个参数。
    • string
      指定查询的字符串。
    • index
      1. 开始查询的位置,取值为整数。
      2. 取值不正确或不填默认从0开始。
  2. 用法:方法用于判断一个字符串是否包含在另一个字符串中,根据情况返回truefalse
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    let str = "hello world";
    let str1 = "world";
    console.log(str.includes(str, 0));
    console.log(str.includes(str1, 6));
    console.log(str.includes(str1, 20));
    console.log(str.includes(str1, "ads"));
    // 打印结果
    true
    true
    false
    true

startWith()方法

  1. 参数:两个参数。
    • string
      指定查询的字符串。
    • index
      1. 开始查询的位置,取值为整数。
      2. 取值不正确或不填默认从0开始。
  2. 用法:方法用来判断当前字符串是否是以另外一个给定的子字符串开头的,根据判断结果返回truefalse
    1
    2
    3
    4
    5
    6
    7
    8
    let str = "object is not found";
    console.log(str.startsWith("object", 1));
    console.log(str.startsWith("object"));
    console.log(str.startsWith("object", "sadas"));
    // 打印结果
    false
    true
    true

endWith()方法

  1. 参数:两个参数。
  • string
    指定查询的字符串。
  • index
    1. 开始查询的位置,取值为整数。
    2. 取值不正确或者不填默认字符串末尾是否已要查找的字符串结尾。
    3. 如果传值正确,则表示从str.length-index处往前的字符串是否以要查找的字符串结尾。
  1. 用法:方法用来判断当前字符串是否是以另外一个给定的子字符串“结尾”的,根据判断结果返回truefalse
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    let str = "object,String";
    console.log(str.endsWith("object")); // false
    console.log(str.endsWith("String")); // true

    // 从str.length - index往前的字符串
    // 从7索引位置开始前面的字符串是否包含object
    console.log(str.endsWith("object", 6)); // true

    // 从6索引位置开始前面的字符串是否包含object
    console.log(str.endsWith("object", 7)); // false

padStart()方法, padEnd()方法

  1. 参数:两个参数。
    • length
      1. 补全字符串的长度,取值为整数。
      2. 如果原字符串长度大于补全长度,则返回原字符串。
    • string
      1. 用来补全的字符串。
      2. 如果不填则以空字符串补全。
      3. 如果补全的字符串长度与原字符串长度相加大于了补全长度参数,则会截取大于补全长度的多余的补全字符串。
  2. 用法:方法用来在字符串头部/尾部补全不够指定长度的字符串,返回新的字符串,不改变原来字符串。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    let str = "1";
    console.log(str.padStart(3));
    console.log(str.padEnd(3));
    console.log(str.padStart(3, "2"));
    console.log(str.padEnd(3, "2"));

    let str1 = "abcdefg";
    console.log(str1.padStart(10, "hijklm"));
    console.log(str1.padEnd(10, "hijklm"));

    let str2 = "09-12"
    console.log(str2.padStart(10, "YYYY-MM-DD"));

    let str3 = "abc";
    console.log(str3.padStart(2));
    console.log(str3.padEnd(2, "2222"));

    // 打印结果
    " 1"
    "1 "
    "221"
    "122"

    "hijabcdefg"
    "abcdefghij"
    "YYYY-09-12"

    "abc"
    "abc"

repeat()方法

  1. 参数:一个参数。
    • number
      1. 指定重复的次数,取值为整数。
      2. 取值为0表示重复0次,返回空字符串。
      3. 取值为NaN或者(-1,0]number = 0
      4. 字符串转化成数字。
      5. 小于等于-1的数或者无限数都会报错。
      6. 小数直接取整。
  2. 用法:方法用来把原字符串重复n次,返回新字符串。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    let str = "a";
    console.log(str.repeat(0));
    console.log(str.repeat(2));
    console.log(str.repeat(2.9));

    console.log(str.repeat("asd"));
    console.log(str.repeat(-0.9));

    console.log(str.repeat("2"));

    console.log(str.repeat(-1));
    console.log(str.repeat(Infinity));
    // 打印结果
    ""
    "aa"
    "aa"

    ""
    ""

    "aaa"

    "Uncaught RangeError: Invalid count value"
    "Uncaught RangeError: Invalid count value"

由于正则这块忘得差不多了,所以String与正则相关的方法会在后续完成正则的复习后再加上…

----------本文结束感谢您的阅读-----------
谢谢打赏,好人一生平安