字符串对象

基本包装类型:

为了方便操作基本数据类型,JavaScript还提供了三个特殊的引用类型:String、Number、Boolean。

基本包装类型就是把简单数据类型包装成为复杂数据类型,这样基本数据类型就有了属性和方法。

先来看一个例子:

  var str = 'city'; // 查看这个字符串里面有几个字符

​    console.log(str.length);

​ // 按道理str是个简单数据类型它怎么会有 length 属性呢?

​ // 因为我们前面反复强调:对象才有属性和方法 也就是 复杂数据类型才有 属性和方法

​ // 其实这两行代码在JS眼里,他给你进行了包装,把简单数据类型包装成了复杂数据类型 这一个就叫做基本包装类型

​ // 你看上去只写了两行代码,实际上它 内部给你做了这么几步操作:

    // (1) 把简单数据类型包装为复杂数据类型

​    var temp = new String('city');

​    // (2) 把临时变量的值 给 str

​    str = temp;

​    // (3) 销毁这个临时变量

​    temp = null;

字符串的不可变

    var str = 'city';
    console.log(str);
    str = 'book';
    // 当重新给 str 赋值的时候,常量'city' 不会被修改,依然在内存中

    // 重新给字符串赋值,会重新在内存中开辟空间,这个特点就是字符串的不可变
     console.log(str); // 里面的值确实是变成了book,那么为什么还说它是不可变的呢?
       /*  str 在内存开辟在一个空间 地址指向了 'city' ,但是我们又开辟了一个内存空间,里面存的是'book' ,  然后str指向了新的空间,但其实 'city' 这个空间还是存在的,它没有做修改。 */

字符串的不可变:指的是里面的值不可变,虽然看上去可以改变内容,但其实是地址变了,内存中新开辟了一个内存空间

由于字符串的不可变,在大量拼接字符串的时候会有效率问题:

 var str = '';
     for (var i = 1 ;i <= 100000; i++) {
         str += i;
        }
     console.log(str); // 这个结果需要花费大量时间来显示,因为需要不断的开辟新空间

根据字符返回位置

字符串所有的方法,都不会修改字符串本身(字符串是不可变的),操作完成会返回一个新的字符串。

方法名说明
indexOf('要查找的字符',开始的位置)返回指定内容在原字符串中的位置,如果找不到就返回-1,开始的位置是indexOf索引号
lastlndexOf()从后往前找,只找第一个匹配的。

根据字符返回位置:

 var str = '道,可道,非常道';

 console.log(str.indexOf('道')); // 跟之前获取数组索引一样 查找给定元素的第一个索引 

 // 如果我要查询第二个道呢?第三个呢?解决方法是:要查找的字符后面跟一个起始位置

 console.log(str.indexOf('道',2)); // 从第二个索引号开始查找 得到第二个道

 console.log(str.indexOf('道',4)); // 得到第三个道

根据位置返回字符 (重点)

方法名说明使用
charAt(index)返回指定位置的字符(index 字符串的索引号)str.charAt(0)
charCodeAt(index)获取指定位置处字符的ASCll码(index 索引号)str.charCodeAt(0)
str[index]获取指定位置处字符HTML5、IE8+支持和charAt()等效
 // 根据位置返回字符(重点)
      // 1.charAt(index) 
      var str = 'abcdefg';
      console.log(str.charAt(2)); // 返回 c 
      // 遍历所有字符:
      for (var i = 0 ;i<str.length;i++) {
        console.log(str.charAt(i)); 
      }

      // 2.charCodeAr(index) 返回相应索引号的字符 ASCll值 目的: 判断用户按下了那个键
      console.log(str.charCodeAt(1)); //返回的是ASCll码 b 对应的是 98。

      // 3.str[index] HTML5、IE8+支持 H5新增的
      console.log(str[6]); 

拼接以及截取字符串

字符串操作方法 (重点)

方法名说明
concat(str1,str2,str3.....)concat()方法用于连接两个或多个字符串。拼接字符串,等效于+,+更常用
substr(start,length)从start位置开始(索引号),length 取的个数 重点记住这个
slice(start,end)从start位置开始,截取到end位置,end取不到 (它们俩都是索引号)
substring(start,end)从start位置开始,截取到end位置,end取不到 基本和slice相同 但是不接受负值
// 1.concat('字符串1','字符串2',.....)
        var str = 'city';
        console.log(str.concat('list')); // 'city' 拼接了 'list'  结果是'citylist'
        
        // 2.substr('截取的起始位置','截取几个字符');
        var str1 = '天下皆知美之为美';
      console.log(str1.substr(2,6)); //皆知美之为美 第一个2 是索引号2  第二个6 是取几个字符

替换字符串以及转换为数组

replace()方法

​ replace() 方法用于在字符串中用一些字符替换另一些字符,其使用格式如下:

字符串.replace('被替换的字符','要替换的字符');

split()方法

​ split() 方法用于切分字符串,它可以将字符串切分为数组。在切分完毕之后,返回的是一个新的数组。

​ 其使用格式如下:

字符串.split('分隔符');
 // 1.替换字符 replace('被替换的字符','替换为的字符');  它只会替换第一个字符
        var str = 'city';
        console.log(str.replace('c','a')); // 把 c 替换为 a
        // 如果有两个或多个相同的字符 replace() 可以替换多个相同的字符吗?答案是:不可以,它只会替换第一个字符
        var str1 = 'citycbty';
        console.log(str1.replace('c','q')); // qitycbty
        // 可以使用循环来
        while (str1.indexOf('c') !== -1) {
            str1 = str1.replace('c','@');
        }
        console.log(str1);

        // 2.字符转换为数组 split('分隔符') 前面我们学过 join 把数组转换为字符串
        var str2 = 'copy,call,temp';
    console.log(str2.split(','));  // 注意:split里面的分隔符取决于你字符串用什么把它们分开的
        var str3 = 'copy&call&temp'; 
        console.log(str3.split('&'));
文章目录