ES6基础语法之字符串扩展

2024-04-02 19:04:59 952人浏览独家记忆

摘要

一、字符串的遍历 js中遍历字符串： var str = "hello,world"; for(var i = 0;i<str.length;i++) { console.l

一、字符串的遍历

js中遍历字符串：

var str = "hello,world";
for(var i = 0;i<str.length;i++)
{
	console.log(str[i]);
}

es6扩展的遍历字符串方法：

let str = "hello,world";
for(let c of str)
{
	console.log(c);
}

二、字符串识别、重复、补全

字符串识别：

ES6 之前判断字符串是否包含子串，用 indexOf 方法，ES6 新增了子串的识别方法。

includes()：返回布尔值，判断是否找到参数字符串。

startsWith()：返回布尔值，判断参数字符串是否在原字符串的头部。

endsWith()：返回布尔值，判断参数字符串是否在原字符串的尾部。

以上三个方法都可以接受两个参数，需要搜索的字符串，和可选的搜索起始位置索引。

let str = "jack,rose,mike";
console.log(str.includes("rose")); //true
console.log(str.includes("rose",5)); //true
console.log(str.startsWith("jack")); //true
console.log(str.startsWith("rose",5));//true
console.log(str.endsWith("mike")) //true
console.log(str.endsWith("se",9)) //true(前面9个字符中去查找判断)

字符串重复：

repeat()：返回新的字符串，表示将字符串重复指定次数返回

let str = "hello,";
console.log(str.repeat(3));

字符串补全：

padStart：返回新的字符串，表示用参数字符串从头部（左侧）补全原字符串。

padEnd：返回新的字符串，表示用参数字符串从尾部（右侧）补全原字符串。

//使用padStart补全编号
let id = 25;
console.log((id+"").padStart(6,"0"));

三、模板字符串

模板字符串相当于加强版的字符串，用反引号 `,除了作为普通字符串，还可以用来定义多行字符串，还可以在字

符串中加入变量和表达式。

多行字符串使用：

//方案一：普通字符串换行
// let str = `I Love JS\nI Love ES`;
// console.log(str);

//方案二：多行字符串
// let str = `I Love JS
// I Love ES`;
// console.log(str);

字符串中插入变量：

//方案一:JS拼接字符串
// var name = "佩奇"; //保存姓名
// var hobby = "游戏,运动,看书"; //保存爱好
// var obj = document.getElementById("content");
// obj.innerhtml = "<h2>大家好,我是"+name+",我的爱好有"+hobby+"</h2>";

//方案二:ES6模板字符串
// let name = "佩奇"; //保存姓名
// let hobby = "游戏,运动,看书"; //保存爱好
// let obj = document.getElementById("content");
// obj.innerHTML = `<h2>大家好,我是${name},我的爱好有${hobby}</h2>`;

//字符串中嵌入变量
// let [name,hobby] = ["jack","抽烟,喝酒,烫头"];
// let str = `大家好,我是${name},我喜欢${hobby}`;
// console.log(str);

模板字符串的注意点：

//(1)如果模板字符串中需要表示反引号,用\转义
// let str = `\`hello\``;
// console.log(str);

//(2)模板字符串内可以放入表达式
// let x = 5;
// let y = 6;
// let str = `${x}*${y}=${x*y}`;
// console.log(str);

//(3)模板字符串中可以调用函数
// function fun()
// {
// 	return "hello,world!";
// }
// let str = `测试函数调用:${fun()},调用成功!`;
// console.log(str);

使用模板字符串输出列表：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>模板字符串中输出列表</title>
	</head>
	<body>
		<div id="content">		
		</div>		
	</body>
	<script>
		let [pro1,pro2,pro3,pro4]=["计算机技术","电子商务","国际贸易","工商管理"];
		let str = `
			<h2>专业列表如下</h2>
			<ul>
				<li>${pro1}</li>
				<li>${pro2}</li>
				<li>${pro3}</li>
				<li>${pro4}</li>
			</ul>
		`;
		document.getElementById("content").innerHTML=str;
	</script>
</html>

到此这篇关于ES6基础语法之字符串扩展的文章就介绍到这了。希望对大家的学习有所帮助，也希望大家多多支持编程网。

点击免费下载>>软考高级考试备考技巧/历年真题/备考精华资料

--结束END--

本文标题: ES6基础语法之字符串扩展

本文链接: https://www.lsjlt.com/news/147814.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑，方便收藏和打印～

下载Word文档

去做题

猜你喜欢

ES6基础语法之字符串扩展

一、字符串的遍历 JS中遍历字符串： var str = "hello,world"; for(var i = 0;i<str.length;i++) { console.l...

99+

2024-04-02
ES6基础语法之字符串扩展的方法

这篇文章主要介绍“ES6基础语法之字符串扩展的方法”，在日常操作中，相信很多人在ES6基础语法之字符串扩展的方法问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答”ES6基础语法之字符串扩展的方法”的疑惑有所帮助！...

99+

2023-06-30
ES6基础语法之数组拓展

一、Array.of() 将参数中所有值作为元素形成数组： console.log(Array.of(1, 2, 3, 4)); // [1, 2, 3, 4] 参数的值可以为不同的...

99+

2024-04-02
Python基础之字符串

初识字符串字符串的认识首先，我们先认识下什么是字符串： # 定义字符串 t_str1 = "Hello World" t_str2 = "asdfghh" print(t_str1) # Hello World print(t_s...

99+

2023-01-31

字符串基础 Python
Python 字符串扩展

Python 字符串扩展，按照字符串处理效果整理一、修改字符串字符：---------------------------------------------------1）str.capitalize() 返回字符串的副本，其中第一...

99+

2023-01-31

字符串 Python
Python基础篇之字符串方法总结

目录字符串拼接字符串分割字符串替换字符串大小写转换字符串判断partition()的用法总结python中字符串内置方法很多，可以通过dir()方式查看具体有哪些方法，下表是pyth...

99+

2023-05-17

Python字符串方法总结 Python字符串方法 Python字符串
ES6基础语法之对象介绍

一、对象和属性和方法 JavaScript中对象： var person={name:"Jack",age:20}; 或： var name = "jack"; var age = ...

99+

2024-04-02
python3——字符串基础

字符串可以使用一对单引号或一对双引号指定起止位置，两种方式指定的字符串完全等价。如'Hello'和"World"可以用三引号（"""或'''）指定多行字符串，其中可自由使用单、双引号而不需转义。如'''"What's your name,"...

99+

2023-01-31

字符串基础
ES6基础语法之函数介绍

一、函数参数的扩展 ES6支持参数的默认值： function fn(name,age,sex="男") { console.log(`大家好,我是${name},性别${sex}...

99+

2024-04-02
ES6基础语法之class类介绍

一、class基本语法 JavaScript 语言中,编写一个学生类,代码如下：（prototype可以个对象添加属性和方法） function Student(stuno,stun...

99+

2024-04-02
C语言详解字符串基础

目录一、字符串的概念二、字符数组与字符串三、字符串字面量的秘密四、字符串的长度五、小结一、字符串的概念字符串是有序字符的集合字符串是程序中的基本元素之一 C 语言中没有字符串的概...

99+

2024-04-02
Python之路-基础数据类型之字符串

字符串是不可变的数据类型索引(下标) 我们在日常生活中会遇到很多类似的情况,例如吃饭排队叫号,在学校时会有学号,工作时会有工号,这些就是一种能保证唯一准确的手段,在计算机中也是一样,它就叫索引,也叫下标, 注意:索引都是从0开始,只有...

99+

2023-01-30

之路字符串数据类型
ES6基础语法之class类怎么用

这篇文章主要介绍了ES6基础语法之class类怎么用的相关知识，内容详细易懂，操作简单快捷，具有一定借鉴价值，相信大家阅读完这篇ES6基础语法之class类怎么用文章都会有所收获，下面我们一起来看看吧。一、class基本语法JavaScri...

99+

2023-06-30
ES6基础语法之Map和Set对象

一、Map对象 Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。 Map中的键值是有序的。 let myMap = new Map(); myMap.se...

99+

2024-04-02
ES6基础语法之模块化介绍

ES6 引入了模块化， ES6 的模块化分为导出（export） @与导入（import）两个模块。 ES6模块化特点：（1）ES6 的模块自动开启严格模式，不管你有没有在模块头部...

99+

2024-04-02
python基础-字符串(6)

一、引言当打来浏览器登录某些网站的时候，需要输入密码，浏览器把密码传送到服务器后，服务器会对密码进行验证，其验证过程是把之前保存的密码与本次传递过去的密码进行对比，如果相等，那么就认为密码正确，否则就认为不对；服务器既然想要存储这些密码...

99+

2023-01-30

字符串基础 python
ES6基础中字符串和函数的示例分析

小编给大家分享一下ES6基础中字符串和函数的示例分析，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！字符串的拓展1.ES6为字符串...

99+

2024-04-02
Python基础:字符串(string)

字符串的常用操作　　字符串与数组一样，支持索引操作、切片与遍历　　索引、切片操作： name = 'jason' name[0] 'j' name[1:3] 'as' 　　遍历： for char in name: pr...

99+

2023-01-31

字符串基础 Python
Python基础之字符串格式化详解

目录一、前言二、百分号2.1 通过位置传参2.2 通过关键字传参三、 format 方式3.1 参数数据类型3.2 传参的方式3.3 格式化的其他配置参数3.4 格式化时间一、前言 ...

99+

2024-04-02
Python入门基础之变量及字符串

目录变量关于变量变量名命名规则字符串原始字符串长字符串总结变量当把一个值赋给一个名字时，它就会存储在内存中，我们把这块内存称为变量（variable）。在大多数语言中，都把这种行...

99+

2024-04-02