es6 随性学习之 字符串 String
时间:2022-07-26
本文章向大家介绍es6 随性学习之 字符串 String,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
字符串
字符串(string)是js的原始数据类型(在java String 是引用类型)
- <span style="color: #ea6f5a">在这里科普一下javaScript的数据了些</span>
- javaScript数据类型有: Number、Boolean、String、undefined、object、Null // ES6 新增 Symbol // es10中新增的数据类型 属于原始数据类型 用于处理大整数(这里不做过多的介绍 ···手动保命,因为我也不了解···) biglnt // 也是一种新增的基本数据类型
+ javaScript 有八种数据类型 `Number、Boolean、String、undefined、object、Null、Symbol、biglnt`
+ 基本数据类型有:`Number、Boolean、String、undefined、Null、Symbol、biglnt`
+ 引用类型:`object`
+ NaN是Number的一种
+ 这里不做过多的介绍以后会找时间出一期js的数据类型详情
回到原题 string
es6新增的特性
- es6新增方法
-
includes()
判断是否找到参数字符串,找到会返回true
反之false
-
startsWith()
判断参数字符串是否在原字符串的头部,找到会返回true
反之false
-
endsWith()
判断参数字符串是否在原字符串的尾部,找到会返回true
反之false
+ 这三个方法不能传入正则,否则会报错错误 let str = 'aaa,bbb,ccc' console.log(str.includes('bbb')) // true console.log(str.includes('zzz')) // false console.log(str.startsWith('aaa')) // true console.log(str.startsWith('bbb')) // false console.log(str.endsWith('ccc')) // true console.log(str.endsWith('bbb')) // false - 要查找字符串的位置还得用
indexOf
、lastIndexOf
// 顺带科普一下这两个方法 let str1 = 'Hello World' // indexOf() 第一次出现的位置 console.log(str1.indexOf('e')) // 1 (字符串第一位为 0 ) // lastIndexOf() 字符串最后出现的位置 console.log(str1.lastIndexOf('e')) // 1 console.log(str1.lastIndexOf('l')) // 9 别忘了还有空格
-
-
repeat()
repeat英文翻译都是重复 所以javascript中也是对字符串进行重复 并反会重复后的字符串let str = 'hello,' // 参数为数字 重复几次就传几 console.log(str.repeat(3)) // 'hello,hello,hello,' // 当你传入一个小数会向下取整 console.log(str.repeat(3.9)) // 'hello,hello,hello,' // 有同学就会说了 那我传入一个负数行不行 console.log(str.repeat(-0.9)) // 行 会反会 "" // 当你传入的负数 是-1 或者小于-1 时会报错 console.log(str.repeat(-1)) //Uncaught RangeError: Invalid count value // 当然传入 Infinity 也一样会报错 // 如果传入的时字符串 会转换为数字 转换不了数字会输出 "" - 字符串补全
-
padStart()
在原字符串前面添加字符串 -
padEnd()
在原字符串后面添加字符串 let str = 'hello' // 接受两个参数 第一个参数控制新生成的字符串长度,第二个参数是需要拼接的字符串 console.log(str.padStart(9, 'a')) // "aaaahello" // 也可以直接在字符串上使用 console.log('hello'.padStart(9, 'a')) // "aaaahello" // 效果是一样的 // 假如 第一个参数不够原字符串长度会反会原字符串 console.log('hello'.padStart(3, 'a')) // "hello" console.log(str.padStart(10, 'abc')) // "abcabhello" console.log('hello'.padStart(10, 'abc')) // "abcabhello"
-
- 模板字符串
- 在键盘的左上角 esc 下面的案件 功能和 "" ''一样
- 演示一下不一样的地方 let name = 'World' let str = `Hello${name}` // 大括号中可以使用变量和函数 // 用法都差不多 模板字符串 换行和空格都会被保留 // 在输出dom的时候就方便很多 let my_class = 'app' let my_class1 = 'app1' let oldDom = '<div class="' + my_claa + '"><span class="' + my_class1 + '"></span></div>' // 属性多就更加烧脑了 // 使用模板字符串 字符串拼接不容易出错 let newDom = `<div class="${my_class}"><span class="${my_class1}"></span></div>`
```
- 官方给的案例还有一个 标签模板 小编在日常工作中不常用```javascript // 效果一样 alert`Hello World` alert('Hello World') ```文章最后 能不能点个赞
- [SQLServer大对象]——FileTable从文件系统迁移文件
- [机器学习]-[数据预处理]-中心化 缩放 KNN(二)
- [数据清洗]-看上去一样的数字
- [数据清洗]- Pandas 清洗“脏”数据(三)
- [数据清洗]- Pandas 清洗“脏”数据(二)
- [数据清洗]-Pandas 清洗“脏”数据(一)
- [数据清洗]-混乱的邮编数据
- 10行代码,Python实现爬取淘宝/天猫评论
- 4.请求安全-- 结合使用的安全优势总结
- TensorFlow强化学习入门(4)——深度Q网络(DQN)及其扩展
- 3.请求安全-- 如何验证请求的唯一性
- 2.请求安全-- MD5的必要性以及实际应用场景
- 1.请求安全-- 一个简单的 单设备登录 单点登录
- phalapi-进阶篇3(自动加载和拦截器)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 牛客网-包含min函数的栈
- 牛客网-反转链表
- 牛客网-替换空格
- 手把手教你破解文件密码、wifi密码、网页密码
- 如何安装 Elastic 栈中的 Logstash
- 你的GitHub项目被封存到北极了吗?
- Logstash: 如何创建可维护和可重用的 Logstash 管道
- 手把手教你微信好友头像形成指定的文字
- Logstash: 应用实践 - 装载 CSV 文档到 Elasticsearch
- LeetCode 剑指 Offer 28. 对称的二叉树
- Mysql拼接查询结果
- 手把手教你如何重建二叉树(超精彩配图)
- 一文搞定插入排序算法
- LeetCode 107. 二叉树的层次遍历 II
- LeetCode 103. 二叉树的锯齿形层次遍历