js--你需要知道的字符串使用方法(含es6及之后)

前言
字符串作为 JavScript 的基本数据类型,在开发以及面试过程中作为程序员对基础掌握情况的重要考点,本文来总结一下字符串的相关属性以及用法。包含了ES6中的一些新语法特性。
正文
1.字符串的创建
JavaScript 中创建字符串的方法主要有两种。一种是通过字面量的方式创建,另一种是通过构造函数创建。分别如下:
// 字面量方式
var str = "hello world";
console.log(str)//hello world
console.log(typeof str);//string // 构造函数方式
var strr = new String("hello Serendipity")
console.log(strr)//String {"hello Serendipity"}
console.log(typeof strr);//object // 两种方式区别
var str = 'hello';
var strr = new String('hello')
var strrr = new String('hello')
console.log(str == strr);//true
console.log(str === strr);// false 两者类型不通,分别是String 和 Object 类型
console.log(strr == strrr);//false 存放在栈中的地址不相同
console.log(strr === strrr);//false 两者在堆中存放的值相同,但是 不是指向同一个值,同样栈中地址不同
2.转义字符和模板字符串
字符串中双引号里面不能包含双引号,单引号里面不能包含单引号,如果想要用到这些关键字符,需要使用转义字符表示,例如:转义字符 \'可以表示为' \\表示为\ \\'表示为\'
var str1 = '001'
var str2 = '002\'这是\\\\一个字符串·'
console.log(str1);//001
console.log(str2);//002'这是\\一个字符串·
同样使用转义字符可以达到换行符、回车的作用:
//同样转义字符实现字符串换行
var str = '<br>this \
<br>is a \
<br>book';
console.log(str);//<br>this <br>is a <br>book
//转义字符还可以将有意义的和没意义的字符进行转换
// \n是新行 \t是回车 \t水平制表符
var st = 'this\n \ris a \tbook'
console.log(st);//this //is a book
es6中为了解决换行导致代码不规则的这种问题,引入了模板字符串,用反引号``包裹住字符串达到换行效果,同时可以直接使用类似于插值表达式的方法获取其值。如下:
//ES6声明字符串的模板 反引号~键位
var ss = '<i>www</i>\
<h2>baidu</h2>.com'
console.log(ss);//<i>www</i>
//<h2>baidu</h2>.com
//使用反引号声明字符串 在反引号中不需要使用\换行》》》m模板字符串
var host = 'www'
var yuming = 'baidu'
var qy = 'com';
var str = `<i>${host}</i><h2>${yuming}</h2>.${qy}`
console.log(str);//<i>www</i><h2>baidu</h2>.com
3.属性
length属性 ,返回字符串的长度,记住是属性,不是方法。
constructor属性,对创建字符串对象的String构造函数的引用。
prototype属性,js中通过构造函数创建的对象实例,都有一个prototype(原型)属性,这个属性是一个指针,这个指针指向一个对象,而这个对象就包含了通过构造函数所实例化的所有实例共享的属性和方法,prototype属性能让构造的实例有能力访问这些属性和方法。
4.方法
(1)charAt()方法,返回指定索引位置的字符。charCodeAt()方法,返回指定索引位置字符对应的unicode值。fromCharCode()方法,将Unicode转化为字符串。
var str = "hello Serendipity"
console.log(str.charAt(2));//l
console.log(str.charCodeAt(2));//108
console.log(String.fromCharCode(108));//l
(2)concat()方法,连接两个字符串,返回连接之后的字符串。
var str1 = "hello "
var str2 = "serendipity"
console.log(str1.concat(str2));//hello serendipity
(3)valueOf()方法,返回某个字符串对象的原始值。toString()方法,返回字符串对象值。
var str = "hello Serendipity"
console.log(str.valueOf());//hello Serendipity
console.log(str.toString());//hello Serendipity
var strr = new String("hello Serendipity")
console.log(strr.valueOf());//hello Serendipity
console.log(strr.toString());//hello Serendipity
(4)subString()方法,提取字符串中两个指定索引之间的字符。substr()方法,从起始索引号提取指定数目的字符。slice()方法提取字符串的片段,并在新的字符串中返回被提取的部分。
var str = "hello Serendippity"
// substring(from, [to]) 方法用于提取字符串中介于两个指定下标之间的字符,方返回的子串包括 start 处的字符,
// 但不包括 stop 处的字符,to 可选,如果省略该参数,那么返回的子串会一直到字符串的结尾。substring() 不接受负的参数。
console.log(str.substring(2));//llo Serendippity
console.log(str.substring(2,5));//llo
console.log(str.substring(-1));//hello Serendippity // substr(start, [length]) 方法可在字符串中抽取从 start 下标开始的指定数目的字符。返回一个新的字符串,包含从 start(包括 start 所指的字符) 处开始的
// length 个字符。如果没有指定 length,那么返回的字符串包含从 start 到该字符串的结尾的字符。
console.log(str.substr(2));//llo Serendippity
console.log(str.substr(2,5));//llo S
console.log(str.substr(-2));//ty // slice(start, [end]) 方法可提取字符串的某个部分,返回一个新的字符串。包括字符串从 start 开始(包括 start)到 end 结束(不包括 end)为止的所有字符。
console.log(str.slice(2));//llo Serendippity
console.log(str.slice(2,5));//llo
console.log(str.slice(-2));//ty
(4)indexOf()方法,返回字符串中检索指定字符串第一次出现的位置。lastIndexOf()方法,返回字符串中检索指定字符串最后一次出现的位置。includes()方法,判断字符串中是否包含指定的子字符串。
var str = "hello serendipity"
console.log(str.indexOf("l"));//2
console.log(str.lastIndexOf("i"));//14
console.log(str.includes("dipi"));//true
console.log(str.includes("pidi"));//false
(5)search()方法,索引与正则表达式相匹配的值。replace()方法,替换与正则表达式匹配的子串。replaceAll()方法,替换与正则表达式匹配的所有子串。match()方法,找打一个或多个正则表达式的匹配。
var str = "hello Serendipity"
// search()方法接收一个正则作为参数,如果字符串中能匹配正则,则返回匹配字串的起始位置,否则返回-1
console.log(str.search(/llo/));//2
console.log(str.search(/LLO/));//-1
//replace()接收两个参数,第一个为需要替换的正则或者字符串,第二个参数为替换成为的内容,返回替换之后的结果
console.log(str.replace(/l/,"o"));//heolo Serendipity
// replaceAll()接收两个参数,第一个为需要替换的正则或者字符串,第二个参数为替换成为的内容,返回替换之后的结果,
//相比replace,只是多了全局的作用范围,同样在replace中用正则可以实现replaceAll的效果
console.log(str.replace(/l/g,"o"));//heooo Serendipity
console.log(str.replaceAll("l","o"));//heooo Serendipity
(6)toUpperCase()方法,把字符串转为大写。toLowerCasse()方法,把字符串转为小写。toLocalLowerCase()方法和toLocalUpperCase()方法根据主机语言环境把字符串转化为相应的大小写。
var str = "hello Serendipity"
console.log(str.toUpperCase());//HELLO SERENDIPITY
console.log(str.toLowerCase());//hello Serendipty
console.log(str.toLocaleUpperCase());//HELLO SERENDIPITY
console.log(str.toLocaleLowerCase());//hello Serendipty
(7)trim()方法,去掉字符串两头的空格。
var str = " hello Serendipity "
console.log(str.trim());//hello Serendipty
console.log(str.length);//23
console.log(str.trim().length);//17
(8)startsWith()方法,判断字符串是否以指定的字符串开始的。endsWith()方法,判断字符串是否是以指定的字符串结束的。
var str = "hello Serendipity"
console.log(str.startsWith("hello"));//true
console.log(str.startsWith("seren"));//false
console.log(str.endsWith("pity"));//true
console.log(str.endsWith("hrllo"));//false
(9)repeat()方法,返回一个字符串复制粘贴多次之后的新字符串。
var str = "hello Serendipity"
console.log(str.repeat(2));//hello Serendipityhello Serendipity
(10)split()方法,将字符串按指定字符分割为数组
var str = "red,blue,green"
console.log(str.split(","));//(3) ["red", "blue", "green"]
总结
以上就是本文的全部内容,希望给读者带来些许的帮助和进步,方便的话点个关注,小白的成长踩坑之路会持续更新一些工作中常见的问题和技术点。

js--你需要知道的字符串使用方法(含es6及之后)的更多相关文章
- 使用js在HTML中自定义字符串格式化方法
Python中支持字符串格式化,其基本形式如下: str = "I'm {name},{age} years old" print(str.format(name="te ...
- js中常用的操作字符串的方法大全
charCodeAt()返回一个整数,代表指定字符的Unicode编码 fromCharCode()从一些Unicode字符串得到一个字符串 charAt()根据指定下标位置返回对应字符,如果下标超 ...
- 常用js对象、数组、字符串的方法
字符串charAt() 返回在指定位置的字符.charCodeAt() 返回在指定的位置的字符的 Unicode 编码.concat() 连接字符串.indexOf() 检索字符串.match() 找 ...
- 浅谈 js 字符串 trim 方法之正则篇
原文:浅谈 js 字符串 trim 方法之正则篇 关于 trim 其实没啥好说的,无非就是去除首位空格,对于现代浏览器来说只是简单的正则 /^\s+|\s+$/ 就可以搞定了.而且支持中文空格 等 ...
- 浅谈 js 字符串 search 方法
原文:浅谈 js 字符串 search 方法 这是一个很久以前的事情了,好像是安心兄弟在学习js的时候做的练习.具体记不清了,今天就来简单分析下 search 究竟是什么用的. 从字面意思理解,一个是 ...
- js生成随机固定长度字符串的简便方法
概述 碰到一个需求:用js生成固定长度的字符串.在网上查了很多资料,网上的方法都比较麻烦.我自己灵光一现,实现了一个比较简单的方法.记录下来,供以后开发时参考,相信对其他人也有用. js生成随机字符串 ...
- JS json对象(Object)和字符串(String)互转方法
[JS json对象(Object)和字符串(String)互转方法] 参考:https://blog.csdn.net/wenqianla2550/article/details/78232706 ...
- js 字符串转方法,this域绑定
闲着没事,开发一个列表页面配置的功能,其中涉及到了按钮点击事件,在页面进行编辑,保存到数据库中.写好的js脚本,function是字符串格式,所以要让生成的脚本生效,还要做一些操作. 1.首先保存在数 ...
- [JS高程] 字符串模式匹配方法
目录 1. RegExp 对象 2. 字符串模式匹配方法 2.1 match() , search() 2.2 replace() 2.2.1 第二个参数为字符串的应用情况 2.2.2 第二个参数为函 ...
随机推荐
- Linux性能分析利器——火焰图的安装使用
火焰图(flame graph)是性能分析的利器,通过它可以快速定位性能瓶颈点. perf 命令(performance 的缩写)是 Linux 系统原生提供的性能分析工具,会返回 CPU 正在执行的 ...
- 056.Python前端Django模型ORM多表基本操作
一 准备工作 1.1 新建一个项目 root@darren-virtual-machine:~# cd /root/PycharmProjects/ root@darren-virtual-machi ...
- Scala 中 object、class 与 trait 的区别
Scala 中 object.class 与 trait 的区别 引言 当你刚入门 Scala,肯定会迫不及待想要编写自己的第一个 Scala 程序.如果你已经在交互模式下敲过 Scala 代码,想必 ...
- JavaEE 前后端分离以及优缺点
前端概念 前端是一切直接与用户交互的页面或软件(用户看得见.摸得着)的统称,比如各种网站网页.andorid 手机各种 App.苹果手机各种 app.微信小程序.网络游戏客户端等.所以,普通人使用计算 ...
- 文字闪烁效果 CSS + HTML
文字闪烁效果 CSS 写在前面 好好学习,天天向上! 效果图 绝美的效果 实现过程 先给没字体添加一些普通的样式,颜色设置为透明 给文字设置一个动画效果,通过text-shadow属性来实现变亮的效果 ...
- 能够划分局域网的VLAN
VLAN与三层交换机 1. VLAN的概述与优势 1.1 分割广播域 1.2 VLAN的优势 2. VLAN的种类 2.1 静态VLAN 2.2 动态VLAN 3. VLAN的ID 4.三层交换机转发 ...
- Linux-SSH介绍与认证方式
Linux SSH 前言: 在实际的生产环境中,运维人员经常要使用本地的计算机对远程主机进行控制工作,TCP/IP协议提供了两种协议来完成这样的操作,分别为Telnet协议和SSH协议. 由于Teln ...
- RMAN-20208: UNTIL CHANGE is before RESETLOGS change
执行recover操作时: RMAN> recover database; Starting recover at 28-NOV-19 using channel ORA_DISK_1 ...
- rman备份出现ORA-19625
[oracle@hear adump]$ rman target / Recovery Manager: Release 11.2.0.4.0 - Production on Mon Jun 17 0 ...
- 在NVIDIA A100 GPU上利用硬件JPEG解码器和NVIDIA nvJPEG库
在NVIDIA A100 GPU上利用硬件JPEG解码器和NVIDIA nvJPEG库 根据调查,普通人产生的1.2万亿张图像可以通过电话或数码相机捕获.这样的图像的存储,尤其是以高分辨率的原始格式, ...