Ⅰ- 壹 -String字符串类型

一 String的创建方式

• 字面量创建方式，存在栈中
• 实例化创建方式，（new）存在栈中
• 构造函数创建方式，会创建一个字符型对象，存在堆中
• 字符串的length 获取字符串的长度。只是可读的 不能修改 只能获取
• str.charAt(1) 等同于 str[1]

// 字面量创建方式
var str="abc",str1='abd',str2=`abc`;

//实例化创建方式
var str4=String('abc');//存在栈中

//构造函数创建方式
var str5=new String('abc');//字符型对象，存在堆中
console.log(str4===str5);//false
console.log(str4==str5);//true

二 基本包装类型

为了方便操作基本数据类型, JavaScript还提供了三个特殊的引用类型: String、Number和Boolean。
基本包装类型就是把简单数据类型包装成为复杂数据类型,这样基本数据类型就有了属性和方法。

1. 对象才有属性和方法 复杂数据类型才有属性和方法
2. 简单数据类型为什么会有lenght 属性呢?
3. 基本包装类型: 就是把简单数据类型包装成为了复杂数据类型

// 基本包装类型
varstr='andy';
console. log(str .length);
//对象才有属性和方法 复杂数据类型才有属性和方法
//简单数据类型为什么会有lenght 属性呢?
//基本包装类型: 就是把简单数据类型包装成为了复杂数据类型
// (1) 把简单数据类型包装为复杂数据类型
var temp=new String('andy' );
// (2) 把临时变量的值给str
str = temp;
// (3) 销毁这个临时变量
temp=nul1:

三 String字符串的不可变

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

1. 当重新给str赋值的时候，常量’abc’不会被修改，依然在内存中
2. 重新给字符串赋值，会重新在内存中开辟空间，这个特点就是字符串的不可变
3. 由于字符串的不可变，在大量拼接字符串的时候会有效率问题;

var str = 'abc' ;
str = 'hello';
//当重新给str赋值的时候，常量'abc'不会被修改，依然在内存中
//重新给字符串赋值，会重新在内存中开辟空间，这个特点就是字符串的不可变
//由于字符串的不可变，在大量拼接字符串的时候会有效率问题;
var str= ‘’;
for(vari=0;i<100000;i++){
   
str += i;
}
console.log(str); //这个结果需要花费大量时间来显示，因为需要不断的开辟新的空间

Ⅱ - 贰 -String字符串对象方法

length获取字符串的长度

let myString = "hello kitty";
myString.length;  // 输出11

一 根据字符返回位置

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

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

1 indexOf

作用: 通过字符, 查找到对应的索引返回
语法:
字符串.indexOf(你要查找的字符)
字符串.indexOf(你要查找的字符, 从哪个索引开始查找)
返回值: 一个数字
如果有这个字符, 那么就返回找到的第一个字符位置的索引
如果没有这个字符, 那么就返回 -1

let myString = "hello kitty";
myString.indexOf('kitty');    // 6
myString.indexOf('Hello');    //-1
myString.indexOf('hello');    //0
myString.indexOf('hello',3);    //-1
//
var str = 'hello world';
// 当你找一个多个字母的字符的时候, 会找到匹配的第一个字母的位置返回
var res = str.indexOf('world');
console.log(res);//结果为 6

2 lastIndexOf()

作用: 通过字符, 查找到对应的索引返回, 从后往前查找
语法:
字符串.lastIndexOf(你要查找的字符)
字符串.lastIndexOf(你要查找的字符, 从哪个索引开始查找)
返回值: 一个数字
如果有这个字符, 那么就返回找到的第一个字符位置的索引
如果没有这个字符, 那么就返回 -1

let myString = "hello kitty";\
myString.lastIndexOf('hello')    // 0
myString.lastIndexOf('world')    // -1
myString.lastIndexOf('kitty')    // 6
myString.lastIndexOf('kitty',3)    // -1
//
var str = 'hello world';
//从右往左找
var res = str.lastIndexOf('l');
console.log(res);//结果为 9

二 根据位置返回字符

方法名	说明	使用
charAt(index)	返回指定位置的字符（index字符串的索引号）	str.charAt(0)
charCodeAt(index)	获取指定位置处字符的ASCII码（index索引号）	str.charCodeAt(0)
str[index]	获取指定位置处字符	HTML5.IE8.和charAt（）等效

1 charAt()

char: 字符, 表示一个字符
at: 在哪
作用: 根据索引找到对应的字符返回
语法:字符串.charAt(索引)
返回值: 对应索引位置的字符
如果有对应索引, 那么得到的就是对应索引位置的字符
如果没有对应索引, 那么得到的是 空字符串

var str = 'hello world';
var res = str.charAt(8);
console.log(res);//结果为 r ,空格也占索引位置

2 charCodeAt()和String.fromCharCode()

charCodeAt()
作用: 根据索引找到对应的字符, 返回字符的编码
语法:字符串.charCodeAt(索引)
返回值: 对应索引位置的字符编码 UTF-8 编码

String.fromCharCode()
作用: 根据对应的字符, 返回Unicode编码对应的值
语法:String.fromCharCode(转换的Unicode码)
返回值: 对应索引位置的字符编码 UTF-8 编码

var str = '你好 世界';
// res 获取的是 你 这个汉字的编码
var res = str.charCodeAt(1);
console.log(res);//结果为 22909 是这个汉字的编码


var rek = String.fromCharCode(res); //编码转换为字符串
console.log(rek)//打印结果为 好

三 字符串操作方法(重点)

方法名	说明
concat(str1,str2,str3…)	concat()方法用于连接两个或多个字符串。拼接字符串,等效于+, +更常用
substr(start,length)	从start位置开始(索引号)，length 取的个数重点记住这个
substring(start, end)	从start位置开始，截取到end位置，end取不到基本和slice 相同但是不接受负值
replace()	方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。
match()	方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。以数组表示
search()	用于检索字符串中指定的子字符串的位置
toUpperCase()	方法用于把字符串转换为大写。
toLowerCase()	方法用于把字符串转换为小写。
slice(start, end)	从start位置开始，截取到end位置, end取不到(他们俩都是索引号)
split()	切割字符串 返回切割之后的一个数组 使用于 对象 方法join（）数组转换为字符 相反

1 concat()

作用: 拼接字符串
语法:字符串.concat(要拼接的字符串1, 要拼接的字符串2, …)
返回值:一个拼接好的字符串
作用和 加号(+) 是一模一样的

let myString = "Hello kitty";
 
//concat()
let str = "aabbcc"
let str2 = " ccddeeff"
myString.concat(str)    // "Hello kittyaabbcc"
myString.concat(str,str2)    // "Hello kittyaabbcc ccddeeff"
//
var str = 'hello world';
var res = str.concat(' 你好 世界');
console.log(res);//结果为 hello world 你好 世界

2 substring() 和substr()

参数都不支持负数
subbstring()
作用: 从字符串里面提取出一些内容
语法:字符串.substring(开始索引, 结束索引) - 包头不包尾 第二个参数不写, 默认到末尾
返回值: 一个新的字符串,从原先字符串里面提取出来的内容

var str2 = 'hello world';
// 从索引 1 开始, 到索引 7, 不包含索引 7
var res2 = str2.substring(1, 7);
console.log(res2);//结果为 ello w

substr()

作用: 从字符串里面提取出一些内容
语法:字符串.substr(开始的索引, 多少个)
第二个参数不写, 默认是按照到字符串末尾计算
返回值: 一个新的字符串,从原先字符串里面提取出来的内容

var str = 'hello world';
// 从索引 1 开始, 向后数 7 个, 提取出来
var res = str.substr(1, 7);
console.log(res);//结果为 ello wo

3 split()

作用: 按照你的需求, 切割字符串
语法:字符串.split(‘你要切割的字符’)
参数你写什么就按照什么给你切割
参数你要是写一个字符串里面没有的字符, 那么给你切割出一个整个的字符串
参数要是不写, 也是切割一个整个的字符串
参数你要是写一个 空字符串(""), 会一位一位给你切割
只能从后向前选
返回值: 是一个 数组
按照你的规则切割好每一部分, 都放到数组里面

let myString = "Hello kitty";
myString.split("");    // ["H", "e", "l", "l", "o", " ", "k", "i", "t", "t", "y"]
myString.split(" ");    // ["Hello", "kitty"]
myString.split(" ")[0];//Hello 字符串 获取下标为零的数据
 
let str2 = "23:34:56:78";
str2.split(":",3)     // ["23", "34", "56"]
 
let str3 = "How,are,you,doing,today?"
str3.split(",")    // ["How", "are", "you", "doing", "today?"]

var str = '2020-05-20';
// 用 - 把字符串分开, 每一段都作为一个数据放在数组里面
var res = str.split('-');
console.log(res);//结果为 ["2020", "05", "20"]

4 replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。

let myString = "Hello kitty";
myString.replace(/kitty/,"world")    // "Hello world"
 
let name = "Doe, John";
name.replace(/(\w+)\s*, \s*(\w+)/, "$2 $1");    // "John Doe"

5 match() 方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。

let myString = "hello kitty";
myString.match("hello");    //hello
myString.match("Hello");    //null
 
let str = "2 plus 3 equal 5"
str.match(/\d+/g)    //["2", "3", "5"]

6 slice()

slice 和数组的slice等同

作用: 从字符串里面提取一部分数据
语法:
字符串.slice(开始索引, 结束索引) - 包前不包后
字符串.slice(开始索引, 负整数)
当你写负整数的时候, 表示 字符串.length + 负整数
返回值: 一个字符串,从原始字符串里面提取出来的一部分

var str = 'abcdefghijklmn';
// 提取 str 字符串中索引 1 到索引 10 的字符, 不包含索引 10
var res1 = str.slice(1, 10);
// 你写 -3 等价于 str.length + -3 === 11
var res2 = str.slice(1, -3);
var res3 = str.slice(1, 11);
console.log(res1);//结果为 bcdefghij
console.log(res2);//结果为 bcdefghijk
console.log(res3);//结果为 bcdefghijk

7 toUpperCase() 、toLowerCase()

toUpperCase() 方法用于把字符串转换为大写。
作用: 把字符串里面所有的小写字母转换成大写字母
语法:字符串.toUpperCase()
返回值: 就是转换好的字符串

var str2 = 'abcdefg';
var res2 = str2.toUpperCase();
console.log(res2);//结果为 ABCDEFG

toLowerCase() 方法用于把字符串转换为小写。
作用: 把字符串里面所有的大写字母转换成小写字母
语法:字符串.toLowerCase()
返回值: 就是转换好的字符串

var str = 'ABCDEFG';
var res = str.toLowerCase();
console.log(res);//结果为 abcdefg

四 案例

• split方法可以将字符串转换为数组，便可以使用数组的方法

• 反之 join 也是可以转换为字符串也是可以使用 字符串的方法

1 url截取

1

function getURLPram(url){
   
            url=url.split("?")[1];
            var obj={
   };
            var arr=url.split("&");
            for(var i=0;i<arr.length;i++){
   
                var str=arr[i];
               var arr1=str.split("=");
                obj[arr1[0]]=arr1[1];
            }
            return obj;
        }

2

function getURLPram(url){
   
           return url.split("?")[1].split("&").reduce(function(value,item){
   
                var arr=item.split("=");
                value[arr[0]]=arr[1];
                return value;
           },{
   })
        }

var url="https://detail.tmall.com/item.htm?id=570063940353&ali_refid=a3_430406_1007:116401153:J:157145175_0_1069023083

  var obj= getURLPram(url);
      console.log(obj);

2 字符串翻转

var str="abcdef";
    // 转换成数组，然后反转，然后再用""连接
 str=str.split("").reverse().join("");
 console.log(str);