美文网首页
JS原生引用类型解析4-String类型

JS原生引用类型解析4-String类型

作者: love丁酥酥 | 来源:发表于2018-02-24 20:35 被阅读17次

    (注1:如果有问题欢迎留言探讨,一起学习!转载请注明出处,喜欢可以点个赞哦!)
    (注2:更多内容请查看我的目录。)

    1. 简介

    为了便于操作基本类型值,ECMAScript提供了3个特殊的引用类型作为基本包装类型:String,Number和Boolean。实际上,每当读取一个基本类型值得时候,后台就会创建一个对应的基本包装类型的对象,从而让我们能够调用一些方法来操作这些数据。

    2. String类型对象创建

    String类型是与字符串对应的引用类型,String类型对象创建是使用String构造函数。下面是使用String构造函数传入不同类型参数后的情况。

    // 传入Number类型
    console.log(new String(1));  // String {"1"}
    // 传入NaN类型
    console.log(new String(NaN));  // String {"NaN"}
    // 传入Infinity类型
    console.log(new String(Infinity));  // String {"Infinity"}
    // 传入String类型
    console.log(new String('123'));  // String {"123"}
    // 传入Undefined类型
    console.log(new String(undefined));  // String {"undefined"}
    // 传入Null类型
    console.log(new String(null));  // String {"null"}
    // 传入Boolean类型
    console.log(new String(true));  // String {"true"}
    // 传入Array类型
    console.log(new String([1,2]));  // String {"1,2"}
    // 传入Function类型
    console.log(new String(function(){return 1;}));  // String {"function (){return 1;}"}
    // 传入Object类型
    console.log(new String({a: 1}));  // String {"[object Object]"}
    

    省略new的效果一样。

    3. 字符串读取

    其实,在读取模式中访问字符串时,后台会自动完成以下处理:

    (1)创建String类型的一个实例;
    (2)在实例上调用指定的方法;
    (3)销毁该实例。

    4. String构造函数的属性与方法

    我们用Object.getOwnPropertyNames()方法获取String构造函数的所有属性与方法。

    Object.getOwnPropertyNames(String);
    // (6) ["length", "name", "prototype", "fromCharCode", "fromCodePoint", "raw"]
    

    发现一共有6个属性和方法。

    4.1 String构造函数的属性

    String.length
    长度为1

    String.name
    名称为"String"

    String.prototype
    指向String构造函数的原型,可以为所有 String 类型的对象添加属性。

    4.2 String构造函数的方法

    String.fromCharCode()
    返回使用指定的Unicode值序列创建的字符串。注意是返回一个字符串,而不是一个 String 对象。

    String.fromCharCode([65,66,67]);  // "ABC"
    

    注意:尽管绝大部分常用的 Unicode 值可以用一个 16-bit 数字表示(正如 JavaScript 标准化过程早期),并且对于绝大部分值 fromCharCode() 返回一个字符(即对于绝大部分字符 UCS-2 值是 UTF-16 的子集),但是为了处理所有的 Unicode 值(至 21 bits),只用 fromCharCode() 是不足的。由于高位编码字符是用两个低位编码(lower value)表示形成的一个字符,因此String.fromCodePoint(ES6 规范的一部分)被用来返回这样一对低位编码,从而可以完全表示这些高位编码字符。

    String.fromCodePoint()
    返回使用指定的代码点序列创建的字符串。

    String.fromCodePoint(65,66,67);  // "ABC"
    

    String.raw()
    用来获取一个模板字符串的原始字面量值。

    String.raw `Hi\n!`;                 
    // "Hi\\n!",这里得到的不是 Hi 后面跟个换行符,而是跟着 \ 和 n 两个字符
    
    String.raw `Hi\u000A!`;             
    // "Hi\\u000A!",同上,这里得到的会是 \、u、0、0、0、A 6个字符,
    // 任何类型的转义形式都会失效,保留原样输出,不信你试试.length
    
    let name = "Bob";
    String.raw `Hi\n${name}!`;             
    // "Hi\\nBob!",内插表达式还可以正常运行
    
    String.raw({raw: "test"}, 0, 1, 2); 
    // "t0e1s2t",我认为你通常不需要把它当成普通函数来调用
    

    5. String原型对象的属性与方法

    我们用Object.getOwnPropertyNames()方法获取String原型对象的所有属性与方法。

    Object.getOwnPropertyNames(String.prototype);
    // (46) ["length", "constructor", "anchor", "big", "blink", "bold", "charAt", "charCodeAt", "codePointAt", "concat", "endsWith", "fontcolor", "fontsize", "fixed", "includes", "indexOf", "italics", "lastIndexOf", "link", "localeCompare", "match", "normalize", "padEnd", "padStart", "repeat", "replace", "search", "slice", "small", "split", "strike", "sub", "substr", "substring", "sup", "startsWith", "toString", "trim", "trimLeft", "trimRight", "toLowerCase", "toUpperCase", "valueOf", "toLocaleLowerCase", "toLocaleUpperCase", "encodeHTML"]
    

    发现一共有46个属性和方法。其中有相当一部分是与HTML相关的方法。

    5.1 String原型对象的属性

    String.prototype.constructor
    指向构造函数Array

    String.prototype.length
    长度为0

    5.2 String原型对象的方法

    5.2.1 跟HTML无关的方法

    String.prototype.charAt()
    返回特定位置的字符。

    String.prototype.charAt()
    返回表示给定索引的字符的Unicode的值。

    String.prototype.codePointAt()
    返回使用UTF-16编码的给定位置的值的非负整数。

    String.prototype.concat()
    连接两个字符串文本,并返回一个新的字符串。

    String.prototype.includes()
    判断一个字符串里是否包含其他字符串,返回true或者false。

    String.prototype.endsWith()
    判断当前字符串是否是以另外一个给定的子字符串“结尾”的,根据判断结果返回true或者false。

    String.prototype.indexOf()
    字符串对象中返回首个被发现的给定值的索引值,如果没有找到则返回-1。

    String.prototype.lastIndexOf()
    从字符串对象中返回最后一个被发现的给定值的索引值,如果没有找到则返回-1。

    String.prototype.localeCompare()
    返回表示给定索引的字符的Unicode的值。

    // The letter "a" is before "c" yielding a negative value
    'a'.localeCompare('c'); 
    // -2 or -1 (or some other negative value)
    
    // Alphabetically the word "check" comes after "against" yielding a positive value
    'check'.localeCompare('against'); 
    // 2 or 1 (or some other positive value)
    
    // "a" and "a" are equivalent yielding a neutral value of zero
    'a'.localeCompare('a'); 
    // 0
    

    String.prototype.match()
    使用正则表达式与字符串相比较。
    如果字符串匹配到了表达式,会返回一个数组,数组的第一项是进行匹配完整的字符串,之后的项是用圆括号捕获的结果。如果没有匹配到,返回null

    String.prototype.normalize()
    会按照指定的一种 Unicode 正规形式将当前字符串正规化。

    String.prototype.padEnd()
    用一个字符串填充当前字符串(如果需要的话则重复填充),返回填充后达到指定长度的字符串。从当前字符串的末尾(右侧)开始填充。
    语法:

    str.padEnd(targetLength [, padString])
    

    参数:

    • targetLength
      当前字符串需要填充到的目标长度。如果这个数值小于当前字符串的长度,则返回当前字符串本身。
    • padString 可选
      填充字符串。如果字符串太长,使填充后的字符串长度超过了目标长度,则只保留最左侧的部分,其他部分会被截断。此参数的缺省值为 " "(U+0020)。

    返回值:
    在原字符串末尾填充指定的填充字符串直到目标长度所形成的新字符串。

    'abc'.padEnd(10);          // "abc       "
    'abc'.padEnd(10, "foo");   // "abcfoofoof"
    'abc'.padEnd(6, "123456"); // "abc123"
    'abc'.padEnd(1);           // "abc"
    

    String.prototype.padStart()
    用一个字符串填充当前字符串(如果需要的话则重复填充),返回填充后达到指定长度的字符串。从当前字符串的开始(左侧)开始填充。

    'abc'.padStart(10);         // "       abc"
    'abc'.padStart(10, "foo");  // "foofoofabc"
    'abc'.padStart(6,"123465"); // "123abc"
    'abc'.padStart(8, "0");     // "00000abc"
    'abc'.padStart(1);          // "abc"
    

    String.prototype.repeat()
    构造并返回一个新字符串,该字符串包含被连接在一起的指定数量的字符串的副本。

    
    "abc".repeat(-1)     // RangeError: repeat count must be positive and less than inifinity
    "abc".repeat(0)      // ""
    "abc".repeat(1)      // "abc"
    "abc".repeat(2)      // "abcabc"
    "abc".repeat(3.5)    // "abcabcabc" 参数count将会被自动转换成整数.
    "abc".repeat(1/0)    // RangeError: repeat count must be positive and less than inifinity
    
    ({toString : () => "abc", repeat : String.prototype.repeat}).repeat(2)   
    //"abcabc",repeat是一个通用方法,也就是它的调用者可以不是一个字符串对象.
    

    String.prototype.replace()
    返回一个由替换值替换一些或所有匹配的模式后的新字符串。模式可以是一个字符串或者一个正则表达式,替换值可以是一个字符串或者一个每次匹配都要调用的函数。

    String.prototype.search()
    对正则表达式和指定字符串进行匹配搜索,返回第一个出现的匹配项的下标。如果匹配成功,则 search() 返回正则表达式在字符串中首次匹配项的索引。否则,返回 -1。

    String.prototype.slice()
    取一个字符串的一部分,并返回一新的字符串。

    String.prototype.split()
    用指定的分隔符字符串将一个String对象分割成字符串数组,以将字符串分隔为子字符串,以确定每个拆分的位置。

    语法:

    str.split([separator[, limit]])
    

    参数:

    • seperator
      指定表示每个拆分应发生的点的字符串。separator 可以是一个字符串或正则表达式。 如果纯文本分隔符包含多个字符,则必须找到整个字符串来表示分割点。如果在str中省略或不出现分隔符,则返回的数组包含一个由整个字符串组成的元素。如果分隔符为空字符串,则将str原字符串中每个字符的数组形式返回。
    • limit
      一个整数,限定返回的分割片段数量。当提供此参数时,split 方法会在指定分隔符的每次出现时分割该字符串,但在限制条目已放入数组时停止。如果在达到指定限制之前达到字符串的末尾,它可能仍然包含少于限制的条目。新数组中不返回剩下的文本。
    'a b c d e f g'.split(' ');  // ["a", "b", "c", "d", "e", "f", "g"]
    'a b c d e f g'.split(' ', 3);  // ["a", "b", "c"]
    

    String.prototype.startsWith()
    判断字符串的起始位置是否匹配其他字符串中的字符。

    String.prototype.subStr()
    返回一个字符串中从指定位置开始到指定字符数的字符。

    语法:

    str.substr(start[, length])
    

    String.prototype.subString()
    返回表示给定索引的字符的Unicode的值。

    语法:

    str.substring(indexStart[, indexEnd])
    

    String.prototype.toLowerCase()
    将字符串转换成小写并返回。

    String.prototype.toLocalLowerCase()
    根据当前区域设置,将符串中的字符转换成小写。对于大多数语言来说,与String.prototype.toLowerCase()的返回值是一致的。

    String.prototype.toUpperCase()
    将字符串转换成大写并返回。

    String.prototype.toLocalUpperCase()
    根据当前区域设置,将符串中的字符转换成大写。对于大多数语言来说,与String.prototype.toUpperCase()的返回值是一致的。

    String.prototype.toString()
    返回指定对象的字符串形式。覆盖了Object对象的 toString() 方法;并没有继承 Object.toString()。对于 String 对象,toString() 方法返回该对象的字符串形式,和 String.prototype.valueOf() 方法返回值一样。

    var x = new String("Hello world");
    console.log(x.toString())      // "Hello world"
    console.log(x.valueOf())      // "Hello world"
    

    String.prototype.valueOf()
    返回特定对象的原始值。覆盖了Object对象的 valueOf() 方法。

    String.prototype.trim()
    会从一个字符串的两端删除空白字符。在这个上下文中的空白字符是所有的空白字符 (space, tab, no-break space 等) 以及所有行终止符字符(如 LF,CR)。

    5.2.2 跟HTML相关的方法

    很少使用,很多都已废弃,建议不要使用。

    6. String实例对象的属性与方法

    我们用Object.getOwnPropertyNames()方法获取String实例对象的所有属性与方法。

    var str = new String('abc');
    Object.getOwnPropertyNames(str);
    // ["0", "1", "2", "length"]
    

    发现String类型每一项的index均为其属性,另外还有一个属性length表示其长度。

    参考

    MDN-String
    BOOK-《JavaScript高级程序设计(第3版)》第5章

    相关文章

      网友评论

          本文标题:JS原生引用类型解析4-String类型

          本文链接:https://www.haomeiwen.com/subject/nckcxftx.html