【面试题】 JavaScript 字符串截取方法有哪些？_截取一个字符串的一部分可以用方法()。 a、substr b

str.substring(indexStart[, indexEnd])
复制代码

参数说明：


* indexStart：需要截取的第一个字符的索引，该索引位置的字符作为返回的字符串的首字母。


* indexEnd：可选。一个 0 到字符串长度之间的整数，以该数字为索引的字符不包含在截取的字符串内。


如果 startIndex 大于 endIndex，则会交换它们的位置。来看一段示例代码：

let str = “深耕WEB开发10+年，拥有一颗工匠的心”;

console.log(str.substring(7)); // 10+年，拥有一颗工匠的心
console.log(str.substring(0, 5)); // 深耕WEB
console.log(str.substring(7, 5)); // 开发
console.log(str.substring(5, 5)); // 空
复制代码

#### substr()


substr() 方法返回一个字符串中从指定位置开始到指定字符数的字符。语法如下：

str.substr(start[, length])
复制代码

第一个参数是截取开始的位置，第二个参数是截取的长度。如下代码：

let str = “深耕WEB开发10+年，拥有一颗工匠的心”;
let result = str.substr(1, 4);
console.log(result); // 耕WEB复制代码

上述代码的 1 表示从第二个字符开始截取，4 表示截取的长度为 4 个字符。



> 
>  substr() 方法在截取字符串时是基于字符位置的，如果截取长度超过了字符串的长度，它会一直截取到字符串的末尾。如果第一个参数是负数，则从字符串的末尾开始计数。 
>  


如果可以的话，建议使用 substring() 来取代 substr()。


#### slice()


slice() 方法提取某个字符串的一部分，并返回一个新的字符串，且不会改动原字符串，与 substring() 方法类似。语法如下：

str.slice(startIndex, endIndex)
复制代码

其中，startIndex 表示要截取的子字符串的起始位置（包含该位置），endIndex 表示要截取的子字符串的结束位置（不包含该位置）。如果只传入 startIndex，则会从该位置一直截取到字符串末尾。如果 startIndex 大于 endIndex，则会返回空字符串。例如：

let str = “深耕WEB开发10+年，拥有一颗工匠的心”;

console.log(str.slice(7)); // 10+年，拥有一颗工匠的心
console.log(str.slice(0, 5)); // 深耕WEB
console.log(str.slice(7, 5)); // “”
console.log(str.slice(5, 5)); // ""复制代码

#### substring() 和 substr() 的区别


substring() 和 substr() 都是截取字符串的方法，但它们有以下区别：



### 最后前端到底应该怎么学才好？

如果你打算靠自己摸索自学，那么你首先要了解学习前端的基本大纲，这是你将要学习的主要内容，理解以及掌握好这些内容，便可以找到一份初级的前端开发工作。你还需要有一套完整的前端学习教程，作为初学者最好的方式就是看视频教程学习，初学者容易理解接受。



不要选择买书学习，这样的方式没有几个人能学会，基本都是看不下去书，也看不懂书。如果喜欢看书的学弟，可以买一些经典的书籍作为辅助即可，主要还是以看教程为主。每天抽出固定几个小时学习，做好长期学习的准备。学习编程并不是每天光看视频，你学习编程最重要的目的是为了编写软件产品，提供给大众使用，所以用手写出代码实现功能才是我们要做的事情。



![在这里插入图片描述](https://img-blog.csdnimg.cn/87c2dbe3aa9546dab0e3e5c674753150.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h6aXQ0OTQ4MDE4MzE=,size_16,color_FFFFFF,t_70#pic_center)  

![在这里插入图片描述](https://img-blog.csdnimg.cn/a3cbdf94b9be48529119539cde243f97.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h6aXQ0OTQ4MDE4MzE=,size_16,color_FFFFFF,t_70#pic_center)



![在这里插入图片描述](https://img-blog.csdnimg.cn/0f2364db34af4d57b77547b5f312230a.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h6aXQ0OTQ4MDE4MzE=,size_16,color_FFFFFF,t_70#pic_center)

![在这里插入图片描述](https://img-blog.csdnimg.cn/187f1f54cfd94cf7b88a363ffa363f10.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h6aXQ0OTQ4MDE4MzE=,size_16,color_FFFFFF,t_70#pic_center)