JavaScript 系列 - string

小刘鸭地下城
105 阅读5分钟 
typeof instance === "string

concat()

concat()  方法将字符串参数连接到调用的字符串，并返回一个新的字符串。

concat() 方法与加号/字符串连接运算符（+，+=）非常相似，不同之处在于 concat() 直接将其参数强制转换为字符串进行连接，而加号运算符首先将其操作数强制转换为原始值，然后再进行连接。

concat(str1)
concat(str1, str2)
concat(str1, str2, /* …, */ strN)

includes()

includes()  方法执行区分大小写的搜索，以确定是否可以在一个字符串中找到另一个字符串，并根据情况返回 true 或 false。

includes(searchString)
includes(searchString, position)

indexOf()

String 的 indexOf()  方法在字符串中搜索指定子字符串，并返回其第一次出现的位置索引。它可以接受一个可选的参数指定搜索的起始位置，如果找到了指定的子字符串，则返回的位置索引大于或等于指定的数字。

indexOf(searchString)
indexOf(searchString, position)

repeat()

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

str.repeat(count)

replace()

replace()  方法返回一个由替换值（replacement）替换部分或所有的模式（pattern）匹配项后的新字符串。模式可以是一个字符串或者一个正则表达式，替换值可以是一个字符串或者一个每次匹配都要调用的回调函数。如果pattern是字符串，则仅替换第一个匹配项。

原字符串不会改变。

str.replace(regexp|substr, newSubStr|function)

replace函数参数.png

replace特殊字符.png

// 交换字符串中的两个单词
var re = /(\w+)\s(\w+)/;
var str = "John Smith";
var newstr = str.replace(re, "$2, $1");
// Smith, John
console.log(newstr);

// 使用行内函数来修改匹配到的字符
function styleHyphenFormat(propertyName) {
  function upperToHyphenLower(match) {
    return "-" + match.toLowerCase();
  }
  return propertyName.replace(/[A-Z]/g, upperToHyphenLower);
}
// border-top
styleHyphenFormat('borderTop')

replaceAll()

replaceAll()  方法返回一个新字符串，新字符串所有满足 pattern 的部分都已被replacement 替换。pattern可以是一个字符串或一个 RegExp， replacement可以是一个字符串或一个在每次匹配被调用的函数。

原始字符串保持不变。

const newStr = str.replaceAll(regexp|substr, newSubstr|function)

slice()

slice()  方法提取某个字符串的一部分，并返回一个新的字符串，且不会改动原字符串。

str.slice(beginIndex[, endIndex]) // 前闭后开

split()

split()  方法接受一个模式，通过搜索模式将字符串分割成一个有序的子串列表，将这些子串放入一个数组，并返回该数组。

split(separator)
split(separator, limit)

substring()

substring()  方法返回一个字符串在开始索引到结束索引之间的一个子集，或从开始索引直到字符串的末尾的一个子集。

str.substring(indexStart[, indexEnd]) // 前闭后开

toLowerCase()

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

str.toLowerCase()

toUpperCase()

toUpperCase()  方法将调用该方法的字符串转为大写形式并返回（如果调用该方法的值不是字符串类型会被强制转换）。

str.toUpperCase()

trim()、trimStart()、trimEnd()

trim()  方法从字符串的两端清除空格，返回一个新的字符串，而不修改原始字符串。此上下文中的空格是指所有的空白字符（空格、tab、不换行空格等）以及所有行终止符字符（如 LF、CR 等）。

trim()

slice 和 substring

  • substring 如果任一参数小于 0 或为 NaN，则被当作 0
  • substring 如果 indexStart 大于 indexEnd，则 substring 的执行效果就像两个参数调换了一样
  • slice 越界情况返回空值

padStart() 和 padEnd()

如果某个字符串不够指定长度，会在头部或尾部补全

padStart()的常见用途是为数值补全指定位数。下面代码生成 10 位的数字字符串

'1'.padStart(10, '0') // "0000000001"
'12'.padStart(10, '0') // "0000000012"
'123456'.padStart(10, '0') // "0000123456"

另一个用途是提示字符串格式

'12'.padStart(10, 'YYYY-MM-DD') // "YYYY-MM-12"
'09-12'.padStart(10, 'YYYY-MM-DD') // "YYYY-09-12"

replace 和 replaceAll

  • replace 替换一次
  • replaceAll 替换所有

其他值转化为字符串

String(a)
a.toString()
a + ""

number

  • number => "number"
  • 指数 => "1.07e+21"
var a = 1.07 * 1000 * 1000 * 1000 * 1000 * 1000 * 1000 * 1000;
// 7次乘以3位 => 21位
a.toString(); // "1.07e+21"

boolean

true => "true"

undefined

undefined => "undefined"

null

null => "null"

object

  • 自定义 toString()
  • Object.prototype.toString()
var a = {};
a.toString();  // "[object Object]"

array

每个值进行字符串然后使用拼接

Symbol

不能隐式转换

var s1 = Symbol("cool");
String(s1); // "Symbol(cool)"
var s2 = Symbol("not cool");
s2 + ""; // TypeError

BigInt

省略 n

JSON 字符串化

JSON.stringify(value, replacer, space)

  • undefined、function、symbol 自动忽略

    • 数组内部 undefined、function、symbol 转化为 null
    JSON.stringify(undefined); // undefined
JSON.stringify(function () { }); // undefined
JSON.stringify([1, undefined, function () { }, 4]); // "[1,null,null,4]"
JSON.stringify({ a: 2, b: function () { } }); // "{"a":2}"

  • toJSON()

    • 自定义一个 JSON 值序列化
    • 循环引用的 object
    var o = {};
var a = {
  b: 42,
  c: o,
  d: function () {},
};
o.e = a;
a.toJSON = function () {
  // 序列化仅包含属性 `b`
  return { b: this.b };
};
console.log(JSON.stringify(a));

    var a = {
  val: [1, 2, 3],
  // 可能正确！
  toJSON: function () {
    return this.val.slice(1);
  },
};
var b = {
  val: [1, 2, 3],
  // 可能不正确！
  toJSON: function () {
    return "[" + this.val.slice(1).join() + "]";
  },
};
JSON.stringify(a); // "[2,3]"
JSON.stringify(b); // ""[2,3]""

  • replacer

    • array
      • string 属性名称
    • function
      • 参数key value
      • 第一次key为 empty string
      • value 为数组时会被遍历
    var a = {
  b: 42,
  c: "42",
  d: [1, 2, 3],
};
JSON.stringify(a, ["b", "c"]); // "{"b":42,"c":"42"}"
JSON.stringify(a, function (k, v) {
  if (k !== "c") return v;
});
// "{"b":42,"d":[1,2,3]}"

  • space

    • 正整数
    • string
    var a = {
  b: 42,
  c: "42",
  d: [1, 2, 3],
};

JSON.stringify(a, null, 3);
// "{
//    "b": 42,
//    "c": "42",
//    "d": [
//       1,
//       2,
//       3
//    ]
// }"

JSON.stringify(a, null, "-----");
// "{
// -----"b": 42,
// -----"c": "42",
// -----"d": [
// ----------1,
// ----------2,
// ----------3
// -----]
// }"
avatar
文章
阅读
粉丝