Ashun's 技術駅 Ashun's 技術駅
首页
  • 前端文章

    • JavaScript
  • 学习笔记

    • 《JavaScript教程》
    • 《JavaScript高级程序设计》
    • 《ES6 教程》
    • 《Vue》
    • 《React》
    • 《TypeScript 从零实现 axios》
    • 《Git》
    • TypeScript
    • JS设计模式总结
  • HTML
  • CSS
  • Vue
  • 现代web布局
  • React
  • 技术文档
  • GitHub技巧
  • Nodejs
  • 博客搭建
  • 技术资源
  • 第一阶段

    • HTML
  • 第二阶段

    • JavaScript
  • 第三阶段

    • Vue
  • 第四阶段

    • 实战项目
  • 每周测试

    • 每周
  • 其他

    • Vue引入UI框架
    • Web前端面试
    • Vue3-resource
  • 学习
  • 面试
  • 心情杂货
  • 实用技巧
  • 福利资源
  • 友情链接
关于
收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

Ashun

前端界的小学生
首页
  • 前端文章

    • JavaScript
  • 学习笔记

    • 《JavaScript教程》
    • 《JavaScript高级程序设计》
    • 《ES6 教程》
    • 《Vue》
    • 《React》
    • 《TypeScript 从零实现 axios》
    • 《Git》
    • TypeScript
    • JS设计模式总结
  • HTML
  • CSS
  • Vue
  • 现代web布局
  • React
  • 技术文档
  • GitHub技巧
  • Nodejs
  • 博客搭建
  • 技术资源
  • 第一阶段

    • HTML
  • 第二阶段

    • JavaScript
  • 第三阶段

    • Vue
  • 第四阶段

    • 实战项目
  • 每周测试

    • 每周
  • 其他

    • Vue引入UI框架
    • Web前端面试
    • Vue3-resource
  • 学习
  • 面试
  • 心情杂货
  • 实用技巧
  • 福利资源
  • 友情链接
关于
收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • 01变量
  • 02常量
  • 03js数据类型
  • 04运算、判断、条件
  • 05数字类型
  • 06字符串
    • 1、声明字符串
    • 2、字符串拼接
    • 3、字符串长度属性
    • 4、字符串操作
      • 1) 字符串截取
      • 2) 字符串转数字
      • 3) 字符串转数组
      • 4) 字符串替换
      • 5) 查找字符串位置
      • 6) 字符串拼接
      • 7) 字符串转大小写
  • 07布尔值
  • 08空值
  • 09未定义
  • 10唯一值
  • 11对象
  • 13数组
  • 14函数
  • 15日期对象
  • 16正则表达式
  • 17异常错误对象
  • 18BOM 浏览器对象模型
  • 19DOM文档对象模型
  • 20json
  • 21Ajax
  • 22jQuery
  • 23函数进阶
  • 24面向对象
  • 《javascript(es5)》
ashun
2022-02-14
目录

06字符串

# 字符串

# 1、声明字符串

在js中单双引号 没有区别,以下没有区别

var a = "hello world"
var b = 'hello world'
1
2

# 2、字符串拼接

es5

var a = "娜美"
var b = "有宙斯"
console.log(a + b); //娜美有宙斯
1
2
3

es6

除了字符串拼接还可以实现换行

let a = "娜美"
let b = "有宙斯"
console.log(`${a}${b}`); //娜美有宙斯
1
2
3

# 3、字符串长度属性

//       1 2 3 4 5 6 7 8 9 10
var a = "娜美,妮可罗宾,大和"
console.log(a.length);//10
1
2
3

# 4、字符串操作

# 1) 字符串截取

slice()、substring()、substr()

slice(start,end) start是必填参数,代表第一个字符串所在的位置,

​ *end*可选,代表最后一个字符串之前, *end*可以是负数

//截取妮可罗宾
var a = "娜美,妮可罗宾,大和"
console.log(a.slice(3, 7));//妮可罗宾
1
2
3
//截取妮可罗宾,大和
var a = "娜美,妮可罗宾,大和"
console.log(a.slice(3, a.length));//妮可罗宾,大和
1
2
3

substring(start,end) 用法跟slice一样,唯一不同是end不能使用负数

var str = '娜美,妮可罗宾,大和';
console.log(str.substring(3)); //妮可罗宾,大和  //第3位后面的数字全都显示
1
2

substr(start,length) 第二个参数为截取长度,不能为负数

var str = '娜美,妮可罗宾,大和';
console.log(str.substr(3, 4)); 
//妮可罗宾   //3是从,后面开始就不要了  4是从,3的前面开始的第四位都要。
1
2
3

# 2) 字符串转数字

Number 或 -0

var a = "5"
console.log(Number(a));//5

var b = "5"
console.log(b - 0);//5

var c = "娜美"
console.log(c - 0);//NaN 文字或英文字母就返回NaN
1
2
3
4
5
6
7
8

# 3) 字符串转数组

split()

console.log(a.split(""));//["h", "e", "l", "l", "o"]

var b = "hello,world"
console.log(b.split(","));//["hello", "world"]

var c = "hello world"
console.log(c.split(" "));//["hello", "world"]
1
2
3
4
5
6
7

# 4) 字符串替换

replace()

var a = "娜美,妮可罗宾,大和"
console.log(a.replace("娜美", "波雅汉考克"));//波雅汉考克,妮可罗宾,大和
1
2

也可以使用正则进行替换 g:所有,i:单个

var a = "波雅汉考克,妮可罗宾,大和"
console.log(a.replace(/波雅汉考克/g, "女帝"));//女帝,妮可罗宾,大和
1
2

# 5) 查找字符串位置

前:indexOf() 后:lastIndexOf()

//       0 1 2 3 4 5 6 7 8 9 10
var a = "这是哪里,在这里,哪里"
console.log(a.indexOf("里"));//3 
console.log(a.lastIndexOf("里"));//10   lastIndexOf这个直接到后了
1
2
3
4

案例:打印所有**【里】**的位置

var a = "这是哪里,在这里,哪里"
var arr = a.split("")
arr.forEach(function (item, dd) {
    if (item === "里") {
        console.log(dd);//3, 7, 10
    }
})
1
2
3
4
5
6
7

# 6) 字符串拼接

es5💖

var a = "娜美"
var b = "有宙斯"
console.log(a + b); //娜美有宙斯
1
2
3

es6,反引号

var a = "娜美"
var b = "有宙斯"
console.log(a.concat(b));//娜美有宙斯
1
2
3

# 7) 字符串转大小写

转大写

var a = "hello"
console.log(a.toUpperCase());//HELLO
1
2

转小写

var b = "WORLD"
console.log(b.toLowerCase());//world
1
2
编辑 (opens new window)
上次更新: 2022/04/24, 13:33:34
05数字类型
07布尔值

← 05数字类型 07布尔值→

最近更新
01
课件-react路由-V6
01-22
02
课件-国际化
01-22
03
课件-redux-toolkit
01-22
更多文章>
Theme by Vdoing | Copyright © 2019-2024 Evan Xu | MIT License
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式