Javascript基础知识之一（常用字符串方法）

一、MDN链接

String - JavaScript | MDNString 全局对象是一个用于字符串或一个字符序列的构造函数。https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String

---

二、简介

【1】String对象属性

属性	描述
constructor	对创建该对象的函数的引用
length	字符串的长度
prototype	允许您向对象添加属性和方法

【2】String 对象方法

方法	描述
charAt()	返回在指定位置的字符
charCodeAt()	返回在指定的位置的字符的 Unicode 编码
indexOf()	检索字符串
lastIndexOf()	从后向前检索字符串
search()	检索与正则表达式匹配的值
substring()	提取字符串中两个指定的索引号之间的字符
slice()	提取字符串的片段，并在新的字符串中返回被提取的部分
concat()	连接字符串
replace()	替换与正则表达式匹配的子串
split()	把字符串分割为字符串数组
toUpperCase()	把字符串转换为大写
toLowerCase()	把字符串转换为小写
toString()	返回字符串
valueOf()	返回某个字符串对象的原始值
includes()	判断一个字符串是否包含在另一个字符串中

---

三、常用方法解读

【1】length属性

length 属性表示一个字符串的长度

var str = "Mozilla";
console.log(str.length);//7

---

【2】字符串的遍历 + charAt() + charCodeAt()

注：charAt() 方法从一个字符串中返回指定的字符。

str.charAt(index) //一个大于等于 0，小于字符串长度的整数。如果不是一个数值，则默认为 0。

注：charCodeAt() 方法返回 0 到 65535 之间的整数，表示给定索引处的 UTF-16 代码单元

str.charCodeAt(index) //一个大于等于 0，小于字符串长度的整数。如果不是一个数值，则默认为 0。

（1）for循环遍历

let str = 'abcdefg';
for (var i = 0; i < str.length; i++) {
    console.log(str.charAt(i)); //a,b,c...
}

（2）for...in...

for(var i in str){
  console.log(i);//i为索引1、2、3...
  console.log(str.charAt(i));//遍历a,b,c...
} 

（3）str[index]  H5新增方法

console.log(str[0]); // a

---

【3】字符串的查找

（1）indexOf()

语法：

str.indexOf(searchValue [, fromIndex])//可选的fromIndex为开始位置

返回：

调用它的 str 对象中第一次出现的指定值的索引，从 fromIndex 处进行搜索（可接连搜索，指定下一次搜索开始位置，如下例子）。如果未找到该值，则返回 -1。

//查找str中o出现的次数
var str = "oabcoefoxyozzopp";
var index = str.indexOf('o');//此处并非必须为单个字符
var num = 0;
while (index !== -1) {
    console.log(index); //循环输出 0、4、7、10、13
    num++;
    index = str.indexOf('o', index + 1);
}
console.log('o出现的次数是: ' + num); //5

（2）lastIndexOf()

语法：

str.lastIndexOf(searchValue[, fromIndex])

返回值同indexOf()，该方法将从尾到头地检索字符串 str，看它是否含有子串 searchValue。开始检索的位置在字符串的 fromIndex 处或字符串的结尾（没有指定 fromIndex 时）。如果找到一个 searchValue，则返回 searchValue 的第一个字符在 str 中的位置。str中的字符位置是从 0 开始的。

（3）search()

search() 方法执行正则表达式和 String 对象之间的一个搜索匹配。

语法：

str.search(regexp) //如果传入一个非正则表达式对象 regexp，则会使用 new RegExp(regexp) 隐式地将其转换为正则表达式对象。

返回值：

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

let str = 'jsjhdydhxnnx'
let a = str.search('nn')
console.log(a)//9

---

【4】字符串的截取

（1）substring()    注「substr即将被废掉」

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

语法：

str.substring(indexStart[, indexEnd])//('截取的起始位置', '截取的结束为止')

描述：

substring 提取从 indexStart 到 indexEnd（不包括）之间的字符。特别地：

• 如果 indexStart 等于 indexEnd，substring 返回一个空字符串。
• 如果省略 indexEnd，substring 提取字符一直到字符串末尾。
• 如果任一参数小于 0 或为 NaN，则被当作 0。
• 如果任一参数大于 stringName.length，则被当作 stringName.length。
• 如果 indexStart 大于 indexEnd，则 substring 的执行效果就像两个参数调换了一样。见下面的例子。

可以见得，substring()的功能有区别于slice()

（2）slice()

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

语法：

str.slice(beginIndex[, endIndex])

特殊情况：

beginIndex、endIndex如果值为负数。以endIndex为例，会被当做 strLength + endIndex 看待，这里的strLength 是字符串的长度。（例如， 如果 endIndex 是 -1 则看作是：strLength - 1）

如果beginIndex > endIndex的情况发生，则会产生一个空，而不会自动调换位置

str.slice(2, -1) 提取第三个字符到倒数第一个字符。

var str1 = '改革春风吹满地';
console.log(str1.substring(2, 4));//春风
console.log(str1.slice(2,4));//春风

---

【5】字符串的连接

（1）加号连接

（2）concat()方法

var str = 'andy';
console.log(str.concat('red'));//andyred
console.log(str+'hello!');//andyhello!

---

【6】字符串的替换

（1）replace()

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

原字符串不会改变。

语法：

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

替换字符 replace('被替换的字符', '替换为的字符') ，它只会替换第一个字符

var str = 'andyandy';
console.log(str.replace('a', 'b'));//bndyandy
console.log(str.replace('an', 'b'));//bdyandy

若要整句替换，可用indexOf()进行判断

var str = 'abcoefoxyozzopp';
while (str.indexOf('o') !== -1) {
    str = str.replace('o', '*');
}
console.log(str);//abc*ef*xy*zz*pp

---

【7】字符串与其他数据类型的相互转换

（1）将字符串转换为数组 split('分隔符')

split() 方法使用指定的分隔符字符串将一个String对象分割成子字符串数组，以一个指定的分割字串来决定每个拆分的位置。 

var str4 = 'red, pink, blue';
console.log(str4.split(','));//['red', ' pink', ' blue']
var str5 = 'red&pink&blue';
console.log(str5.split('&'));//['red', ' pink', ' blue']
var str6 = 'abcdefg';
console.log(str6.split(''));//['a', 'b', 'c', 'd', 'e', 'f', 'g']

（2）将字符串转换为数字  parseInt()

 解析一个字符串并返回指定基数的十进制整数， radix [可选]是2-36之间的整数，表示被解析字符串的基数。注：radix的默认值不是10。

具体参考：parseInt - JavaScript | MDN

语法：

parseInt(string, radix)  

（3）将字符串转换为浮点数  parseFloat()

parseFloat() 函数解析一个参数（必要时先转换为字符串）并返回一个浮点数。

语法：

parseFloat(string)

let str = '3.14'
let a = parseInt(str)
let b = parseFloat(str)
console.log(a) //3
console.log(b) //3.14

（4）将数字型转换为字符型 三种方法

• toString()

var num = 10;
var str = num.toString();
console.log(str);//10
console.log(typeof str);//string

• 利用 String(变量)

var num = 10;
console.log(String(num));//10

• 利用 + 拼接字符串的方法实现转换效果 隐式转换

console.log(num + '');//10

（5）把数组转换为字符串型

• toString()

var array = [1,2,3,4,5,6];
console.log(array.toString());//'1,2,3,4,5,6'

• for循环

var newstr = '';
for(var i=0; i<array.length; i++){
  newstr += array[i];
}
console.log(newstr);//123456

---

【8】大小写转换

字符串名. toLowerCase()    //将大写字符串转换为小写字符串
字符串名. toUpperCase()    //将小写字符串转换为大写字符串

---

【9】一个字符串中是否包含另一个字符串

语法：

str.includes(searchString[, position]) //position可选 默认为0 从当前字符串的哪个索引位置开始搜寻子字符串

例子：

    //returns true or false
    let a = 'Blue Whale'.includes('blue'); // 区分大小写
    console.log(a) //false

---

四、实例

【1】查找次数最多的字符，判断一个字符串 'abcoefoxyozzopp' 中出现次数最多的字符，并统计其次数。

1. 核心算法：利用 charAt(） 遍历这个字符串
2. 把每个字符都存储给对象o， 如果对象没有该属性，就为1，如果存在了就 +1
3. 遍历对象，得到最大值和该字符

var o = {};
var str = 'abcoefoxyozzopp';
// 问题：如何判断对象的属性是否存在？
for(var i = 0;i<str.length;i++){
  var temp = str.charAt(i);
  if(o[temp]){ // o[temp] 得到的是属性值
    o[temp]++;
  }else{
    o[temp] = 1;
  }
}
console.log(o);//{a:1;b:1......}

var max = 0;
var ch = '';
//遍历对象
for(var k in o){//k是属性值,o[k]是对应的值
  if(o[k] > max){
    max = o[k];
    ch = k;
  }
}
console.log(max);//4
console.log('最多的字符是' + ch);//最多的字符是o

【2】要求找到参数数组中出现频次最高的数据类型，并且计算出出现的次数，要求以数组的形式返回。

示例如下：

输入：__findMostType([0,0,'',''])

输出：['number','string',2]或['string','number',2]

const _findMostType = array => {
    // 补全代码
    let o = {}//对象存放
    let num_max = 0 //次数
    array.forEach(function(item){
        let type = item===null ? 'null' : (typeof item ==='function' ? 'object' : (typeof item))
        o[type] = o[type] ? o[type]+1 : 1
        num_max = num_max > o[type] ? num_max : o[type]
    })
      
    let result = [] //返回数组
    for(let i in o){
        if(o[i] == num_max){
            result.push(i)
        }
    }
    result.push(num_max)
    return result
}