字符串

本文详细介绍了JavaScript ES5中的严格模式,包括启用方式、规范作用以及为何使用。此外,还深入讲解了数组的indexOf、lastIndexOf、forEach、map、filter、reduce等方法的用法和示例。同时,提到了字符串的基础操作,如ASCII码、比较规则以及常用字符串方法如charAt、indexOf等。文章最后探讨了Unicode和字符串比较的规则。
摘要由CSDN通过智能技术生成

ES5的语法

严格模式
由于JS的作用域和隐式声明变量等语法会造成很多预想不到的错误,所以ES5中新增了一个严格模式的语法,用语言个规范代码的书写

适用语法:
“use strict”

使用说明:
1.要放在代码的最前面,也就是在script标签中的第一行或者某个函数中的第一行,否则会失效
2.严格模式可以规范当前script标签或者当前函数中的代码,不能闺房别的script标签中的代码和别的函数

规范的语法:
1.不允许隐式声明变量
2.禁止函数中的参数重名
3.禁止函数中的this代表window

为什么要使用严格模式
1.可以让代码更加规范
2.可以让代码运行起来更快,效率提高
注意:当合并文件时,第一行的严格模式代码回失效,建议包在一个自执行函数中

新增数组方法

  1. indexof方法 - 查找某个元素在数组中第一次出现的位置
    lastindexof方法 - 查找某个元素在数组中最后一次出现的位置,语法一致

语法:
数组.indexof(要找的元素,开始查找的起始下标)
参数1:将要查找的元素
参数2:可选项,从哪个下标开始往后找
有返回值:找到了,返回这个元素的下标,没找到,返回-1

例:

var arr = [1,3,5,7,7,5,3,1];
console.log(arr.indexOf(5)); //2
console.log(arr.lastIndexOf(5)); //5
console.log(arr.indexOf(5,2)); //2
console.log(arr.lastIndexOf(5,4)); //2
console.log(arr.indexOf("5")); //-1
  1. forEach方法 - 用于遍历数组

语法:
数组.forEach(function(值,下标,当前数组){
//代码段
})
在这个方法中需要传入一个函数参数,而函数的参数如下
参数1:数组遍历出来的每个值
参数2:可选项。数组遍历出来的每个值对象的下标
参数3:可选项。被遍历的当前数组

使用说明:
这个方法没有返回值,返回值为undefined,不会改变原来数组的值

例:

var arr = [1, 2, 3, 4, 5];
arr.forEach(function(x, index, a){
console.log(x + '|' + index + '|' + (a === arr));
});
// 输出为:
// 1|0|true
// 2|1|true
// 3|2|true
// 4|3|true
// 5|4|true
  1. map方法 - 遍历数组,并将每个元素传入回调函数中处理后,组成新的元素并返回

语法:
数组.map(function(值,下标,当前数组){
//对值进行处理并返回处理后的每个值组成的数组
})

使用说明:
这个方法主要用于以同样的规则处理数组中的每个值,并组成新的数组返回

例:

var arr = [1, 2, 3, 4, 5];
var arr2 = arr.map(function(item){
	return item*item;
});
console.log(arr2); //[1, 4, 9, 16, 25]
  1. filter方法 - 遍历数组,根据过滤条件,帅选出数组中满足条件的元素,组成新数组并返回

语法:
数组.filter(function(值,下标,当前数组){
//帅选条件
})

使用说明:
使用方法和功能跟map方法很像,只是运行规则不一样。map方法中的函数,用于返回新的函数,而filter方法中的函数,根据返回true或false来帅选元素

例:

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var arr2 = arr.filter(function(x, index) {
	return index % 3 === 0 || x >= 8;
}); 
console.log(arr2); //[1, 4, 7, 8, 9, 10]
  1. reduce方法 - 归并,其中调用回调函数,回调函数中有两个参数,第一个是上次操作的返回值,第二个是从第二个元素开始到最后一个元素

语法:
数组.reduce(function(prev,next){
//逻辑代码
return prev+next
})

例:

var arr = [1,2,3,4,5,6];
document.write("prev------next<br>");
var res = arr.reduce(function(prev,next){
    document.write(prev + "------" + next + "<br>");
    // prev 表示上一次操作返回的结果,第一次是第一个数
    // next 表示是下一个数,第一次是第二个数
    return prev + next; // 将每一次操作的结果返回给下一次的prev(数组求和)
});
console.log(res);

在这里插入图片描述

字符串

阿斯克码
阿斯克码计算机中用得最广泛的字符集及其编码,是由美国国家标准局(ANSI)制定的ASCII码(American Standard Code for Information Interchange,美国标准信息交换码)。所以对于英文字母和符号的支持是很全面的。

阿斯克码的具体内容如下:

在这里插入图片描述

在这里插入图片描述

为什么要学习阿斯克码?

因为两个字符串也是可以比较大小的,比较的规则是逐字符进行比较,字符的大小由字符对应的阿斯克码决定。

字符串的比较

我们曾经碰到过一个问题,接收到文本框的两个值,一个是"3",另一个是"10",这两个值进行大小比较的时候,结果是:"3">"10" === true,出现这个结果的原因是,两个字符串进行比较的时候,是逐字符进行比较,也就是字符"3"先和字符"1"进行比较,如果第一个字符相等再进行第二个字符的比较。

从阿斯克码表中,可以找到字符"3"和字符"1"相对应的值,很明显,字符"3"是要大于字符"1"的。

通过阿斯克码表,我们可以得出一些字符串比较的规律:

  1. 字母比数字大
  2. 小写字母比大写字母大
  3. 字母越靠后越大

思考:如何比较两个中文汉字字符的大小?

阿斯克码总共128个,包含符号、大小写英文字母、数字。阿斯克码是由美国人创建的,所以对于英文的支持非常好。后来随着计算机的普及,各个国家在使用计算机的时候,没办法使用本国文字,这样用起来非常困难。所以众多国家的科学家一起制定了一个更大的对照表,包含各个国家的文字符号,所以称之为万国码,也叫作unicode。

其实unicode就是更大的阿斯克码。

字符串的基本操作

字符串也可以通过下标获取字符
例:

var str = '你好吗';
// 输出下标为1的字符
console.log(str[1]); // 好

每个字符都有相对应的下标,所以,字符串也可以进行遍历
字符串是只读数据类型,不能添加新字符,不能修改字符串中的字符,不能删除某个字符
例:

var str = '你好吗';
// 修改下标为1的字符
str[1] = "帅"
console.log(str); // 你好吗

字符串常见API

length属性

求字符串中字符的个数 - 字符串的长度

语法:

字符串.length

例:

var str = 'asdfvczx';
// 输出字符串的长度
console.log(str.length);
字符串方法
  1. charAt方法 - 根据指定下标获取对应的字符

语法:
字符串.charAt(下标)

例:

var str = 'abcdef'
//获取下标为3的字符
var res = str.charAt(3)
console.log(res)

2. charCodeAt方法 - 根据下标获取对应字符的阿斯克码

语法:
字符串.charCodeAt(下标)

例:

var str = 'abcdef'
//获取下标为0的字符的阿斯克码
var res = str.charCodeAt(0)
console.log(res)//97

3. String.fromCharCode方法**

根据阿斯克码得到对应的字符

语法:
String.fromCharCode(阿斯克码)

例:

// 获取98对应的字符
var res = String.fromCharCode(98);
console.log(res); // b

4.indexof方法**

查找字符或子字符串在大字符串中第一次出现的位置

语法:
大字符串.indexOf(字符/子字符串[,开始查找的下标])

使用说明:
1.如果找到这个字符在字符串的位置,就返回这个字符对应的下标,如果找不到,就返回-1
2.第二个参数可选项。表示从哪个下标开始查找

例:

var str = 'i love you'
// 找到o字符在str中第一次出现的位置
var res = str.indexOf('o');
console.log(res); // 3

5.lastindexof方法**

查找字符或子字符串在大字符串中最后一次出现的位置

语法:
大字符串.lastIndexOf(字符/子字符串[,开始查找的下标])

例:

var str = 'i love you';
// 找到o字符在str中最后一次出现的位置
var res = str.lastIndexOf('o');
console.log(res); // 8

使用说明:

  1. 如果找到这个字符在字符串中的位置,就返回这个字符对应的下标,如果找不到,就返回-1
  2. 第二个参数可选项。表示从哪个下标开始查找 - 从该字符的后面向前查找

6. substr方法 - 截取字符串

语法:
字符串.substr(开始下标,截取长度)

例:

var str = '你的头发还好吗';
// 从下标2开始截取2个字符
var res = str.substr(2,2);
console.log(res); // 头发

使用说明:

  1. 第二个参数是可选项。如果省略掉第二个参数,默认截取到字符串末尾。
  2. 开始下标可以使用负数表示,从右往左的下标依次是-1,-2,。。。
  3. 截取字符的时候都是从左向右截取的

例:

var str = '你的头发还好吗';
// 从下表2开始截取
var res = str.substr(2);
console.log(res); // 头发还好吗

// 从下标-5开始截取2个字符
var res = str.substr(-5,2);
console.log(res); // 头发

// 从下标-1开始截取2个字符
var res = str.substr(-1,2);
console.log(res);// 吗

使用说明:截取到最后也不满足长度的时候,就返回能截取到的所有字符

7.substring方法 - 截取字符串

语法:
字符串.substring(开始下标[,结束下标])

例:

var str = '你的头发还好吗';
// 从下标2开始截取到下标4
var res = str.substr(2,4);
console.log(res); // 头发

使用说明:

  1. 第二个参数是可选项。如果省略掉第二个参数的话,默认截取到字符串末尾。
  2. 截取的结果包含开始下标对应的字符,不包含结束下标对应的字符
  3. 如果开始下标和结束下标相等,则返回空字符串;如果开始下标大于结束下标,则先交换两个参数,然后再截取;如果开始下标或结束下标为负数,则先将负数替换成0,然后再截取

例:

var str = '你的头发还好吗';
// 从下标2开始截取
var res = str.substring(2);
console.log(res); // 头发还好吗

// 从下标2截取到下标-2
var res = str.substring(2,-2);
console.log(res); // 你的
/*
过程分析:
首先开始下标大于结束下标,所以先交换两个参数,相当于: str.substring(-2,2);
开始下标为负数,所以替换成0,相当于: str.substring(0,2);
所以结果为:你的
*/

8.slice方法 - 截取字符串**

语法:

字符串.slice(开始下标[,结束下标]);

例:

var str = '你的头发还好吗';
// 从下标2截取到下标4
var res = str.slice(2,4);
console.log(res); // 头发

使用说明:

  1. 第二个参数是可选项。如果省略第二个参数默认截取到字符串的末尾
  2. 返回的结果包含开始下标对应的字符,不包含结束下标对应的字符
  3. 截取的时候,下标可以使用负数表示
  4. 开始下标对应的字符一定要在结束下标对应的字符左边,否则返回空字符串。因为截取的顺序是从左向右的

例:

var str = '你的头发还好吗';
// 从下标2开始截取
var res = str.slice(2);
console.log(res); // 头发还好吗

// 从下标-5开始截取到下标4
var res = str.slice(-5,4);
console.log(res); // 头发

// 从下标-1截取到下标-3
var res = str.slice(-1,-3);
console.log(res); // 空

9.split方法**

使用指定的分隔符将字符串分割成多部分组成数组

语法:

字符串.split([分隔符,[最后数组中要保留的个数]])

例:

var str = 'open_door_now';
// 以下划线为分隔符,分割字符串为数组
var arr = str.split("_");
console.log(arr); // ["open", "door", "now"]

使用说明:

  1. 分隔符是可选项。如果省略了分隔符,则将整个字符串当做数组的元素,如果是空字符串,则会在每个字符中间进行分割
  2. 要保留的个数是可选项。如果省略了个数,则返回全部的个数,如果加上个数,则是设置了数组中元素的个数。

例:

var str = 'open_door_now';
// 省略分隔符将字符串分割为数组
var arr = str.split();
console.log(arr); // ["open_door_now"]

// 以空字符串进行分割字符串
var arr = str.split("");
console.log(arr); // ["o", "p", "e", "n", "_", "d", "o", "o", "r", "_", "n", "o", "w"]

// 以空字符串分割字符串,并在数组中保留4个元素
var arr = str.split("",4);
console.log(arr); // ["o", "p", "e", "n"]
10.replace方法**

使用新的字符或子字符串替换原来在字符串中的一部分

语法:

字符串.replace(将要被替换的部分,要替换进来的新内容);

例:

var str = '你的头发还好吗';
// 使用"眉毛"将"头发"替换掉
var res = str.replace("头发","眉毛");
console.log(res); // 你的眉毛还好吗

使用说明:如果第一个参数是空字符串,则会将新内容拼接到原字符串前面

例:

var str = '你的头发还好吗';
// 使用"眉毛"将""替换掉
var res = str.replace("","眉毛");
console.log(res); // 眉毛你的头发还好吗
11.trim方法**

去除字符串左右两边的空白

语法:

字符串.trim();

例:

var str = '    ab c  ';
// 取出str左右两边的空白
var res = str.trim();
console.log(res); // 'ab c'

使用说明:

  1. 去除的是左右两边的空白,不会去除字符串中间的空白
  2. 只去除左边的空白使用:trimLeft方法;只去除右边的空白使用:trimRight方法
大小写转换方法**

将字符串中所有小写字母转为大写字母,使用:toUpperCase方法

将字符串中所有小写字母转为大写字母,使用:toLowerCase方法

语法:

字符串.toUpperCase(); # 转为大写
字符串.toLowerCase(); # 转为小写
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

F2E_YoverL

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值