es6之字符串添加的东西
在es6里边对字符串添加了一些东西!
字符串模板(非常友善)
相信大家之前都遇到过万恶的字符串拼接,真是噩梦,不过之后有了字符串模板之后,再也不用担心字符串拼接会乱了...
之前的字符串拼接
let name ='Strive';
let age = 18;
let str = '这个人叫'+name+', 年龄是 '+age+'岁'; console.log(str); let str1=`这个人叫${name},年龄是${age}岁`
//现在是这样的 //简直不要太方便有没有
其实这样还好吧 不是很容易乱....
那么这样呢.....(haha)
let data =[
{title:'记瑞士发表人类命运共同体演讲一周年', read:100},
{title:'关心!刚刚,良渚古城遗址正式申报世界遗产', read:9},
{title:'党中央国务院决定了!在全国开展扫黑除恶专项斗争', read:10},
{title:'宪法修改必须依法按程序进行', read:180},
{title:'新时代的中共全面从严治党 北京两会 新时代新气象', read:900}
]
let oUl = document.querySelector('#ul1');
for(let i=0;i<data.lengthl;i++){
let oLi = document.createElement('li');
oLi.innerHTML='<span>'+data[i].title+'</span>'
+'<span>阅读人数:'+data[i].read+'</span>'
+'<a href="javascript:;">详情</a>';
oUl.appendChild(oLi); } //哈哈哈是不是早已经迷了,那还等什么用一下字符串模板吧
for(let i=0;i<data.length;i++){
let oLi = document.createElement('li');
oLi.innerHTML=`<span>${data[i].title}</span><span>阅读人数${data[i].read}</sapn><a herf='Javascript:;'>详情</a>`
oUl.appendChild(oLi)
}
//简直赞爆了
其实es6在字符串中还增加了一些其他的方法:
一 字符串查找
//之前的方法
let str = 'apple banana pear'; if(str.indexOf('banana')!=-1){
alert(true);
}else{
aler(false);
}
//现在的
let str = 'apple banana2 pear'; alert(str.includes('banana'));直接返回truez 应该说各有用处吧 我曾经有个需求还必须的用之前的写
//判断浏览器: includes
if(navigator.userAgent.includes('Chrome')){
alert('是chrome')
}else{
alert('!是chrome')
}
二 字符串检测
字符串是否以谁开头: str.startsWith(检测东西) 检测地址 http://www.xxx.xx
let str ='file:///D:/AppServ/www/ES6-demo/%E5%AD%97%E7%AC%A6%E4%B8%B2%E6%9F%A5%E6%89%BE3.html';
let str2 ='https://www.baidu.com/';
console.log(str2.startsWith('http'));//返回true
字符串是否以谁结尾: str.endsWith(检测东西) 检测图片格式 .png
let str1='sadasdasd.png'
str1.endsWith('.png') //返回true
重复字符串: str.repeat(次数);
str1.repeat(5)
"sadasdasd.pngsadasdasd.pngsadasdasd.pngsadasdasd.pngsadasdasd.png"
填充字符串:
str.padStart(整个字符串长度, 填充东西) 往前填充
str1.padStart(20,'a')
"aaaaaaasadasdasd.png"
str.padEnd(整个字符串长度, 填充东西) 往后填充
str1.padStart(20,'a')
"sadasdasd.pngaaaaaaa"
str.padStart(str.length+padStr.length, padStr)
// 'a' -> 'xxxa'
let str = 'apple';
let padStr = 'x';
总结
字符串查找:
str.indexOf(要找的东西) 返回索引(位置) ,没找到返回-1
str.includes(要找的东西) 返回值 true/false 判断浏览器: includes
es6之字符串添加的东西的更多相关文章
- [js]es6语法: 字符串和数组的方法
s的方法 根据index取value: 取首尾项,arr[0], arr[arr.length-1] 根据value取index(判断是否包含子字符串): s.indexOf 栗子: 'maotai' ...
- ES6让字符串String增加了哪些好玩的特性呢?
确实因为现在天气变热了,所以一天天的这么写我也很累.所以如果阅读的时候有什么错误还请大家指出来,不好意思.学习永无止境. OK,今天继续讲解ES6系列知识 学过上一节的解构赋值就知道,ES6确实给我们 ...
- javascript的replace+正则 实现ES6的字符串模版
采用拼接字符串的形式,将 JSON 数据嵌入 HTML 中.开始时代码量较少,暂时还可以接受.但当页面结构复杂起来后,其弱点开始变得无法忍受起来: 书写不连贯.每写一个变量就要断一下,插入一个 + 和 ...
- sql 解析字符串添加到临时表中 sql存储过程in 参数输入
sql 解析字符串添加到临时表中 sql存储过程in 参数输入 解决方法 把字符串解析 添加到 临时表中 SELECT * into #临时表 FROM dbo.Func_SplitOneCol ...
- ES6中字符串扩展
ES6中字符串扩展 ① for...of 遍历字符串: 例如: for(let codePoint of 'string'){ console.log(codePoint) } 运行结果: ② in ...
- ES6教程-字符串,函数的参数,了解函数的arguments对象,js面向对象,设计模式-单例模式,解构赋值
前言 主要讲解了ES6对字符串的拓展,包括includes,startsWith和endsWith,另外增加了字符串模板. Start includes()是否包含 startsWith()以什么开头 ...
- Java 给Word指定字符串添加批注
本文将介绍在Java程序中如何给Word文档中的指定字符串添加批注.前文中,主要介绍的是针对某个段落来添加批注,以及回复.编辑.删除批注的方法,如果需要针对特定关键词或指定字符串来设置批注,可以参考本 ...
- ES6面向对象 动态添加标签页
HTML <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml&quo ...
- es6模板字符串使用使${} 来包裹一个变量或者一个表达式
es6模板字符串使用使${} 来包裹一个变量或者一个表达式 2019-04-28 14:33:54 Gabriel_wei 阅读数 1774 收藏 更多 分类专栏: 前端 版权声明:本文为博主原 ...
随机推荐
- Spark学习之Spark调优与调试(一)
一.使用SparkConf配置Spark 对 Spark 进行性能调优,通常就是修改 Spark 应用的运行时配置选项.Spark 中最主要的配置机制是通过 SparkConf 类对 Spark 进行 ...
- 入门级 JAVA反射机制
1.什么是反射? Java中的反射机制是Java语言的一个很重要的特性,是Java “动态性” 的重要体现.Java反射机制让我们在程序运行状态中,对于任意一个类,都能知道这个类的所有属性和方法:对于 ...
- WebView,我已经长大了,知道自己区分是否安全了!
一.前言 如果你在用 Android 原生系统(Google Play 服务),在使用 WebView 加载某些网页时,一定遇到过以下的安全警告红屏. 这是 WebView 的安全浏览保护策略,在 A ...
- NIO(生活篇)
今晚是个下雨天,写完今天最后一行代码,小鲁班起身合上电脑,用滚烫的开水为自己泡制了一桶老坛酸菜牛肉面.这大概是苦逼程序猿给接下来继续奋战的自己最好的馈赠.年轻的程序猿更偏爱坐在窗前,在夜晚中静静的享受 ...
- 【java线程】的wait、sleep、join、yied
1.概述 使用Thread相对来说比较简单,没有什么成本,但是通常来说,我们使用线程基本就是覆写run方法,然后调用线程对象的start函数启动线程. 对于面试人员来说,这些都不是面试官会问到的问题, ...
- H5单张、多张图片保存续篇
前言 这篇是接上篇内容.还没看的可以看H5单张.多张图片上传这篇文章预热. 图片入库 本章我们就来看看如何让多种图片保存至数据库中.数据库:mysql 后端:.NET Core 我们回顾一下上篇我 ...
- 最快1天搭建短视频APP!阿里云短视频解决方案上线
短视频行业的发展前景乐观是毋庸置疑的,整个短视频的市场规模一直在增长,网络数据显示2018年已经突破100亿大关,在2019年预测将超过200亿.那么,对于短视频从业者来讲,要持续推动业务的发展,必须 ...
- Github排序(转载)
目录 1. 冒泡排序 2. 选择排序 3. 插入排序 4. 希尔排序 5. 归并排序 6. 快速排序 7. 堆排序 8. 计数排序 9. 桶排序 10. 基数排序 参考:https://mp.weix ...
- 第四周LINUX 学习笔记
内核编译丶sed丶awk Linux:单内核 模块化:动态 /lib/modules lsmod,modinfo,modprobe,insmod,,modprobe -r , ...
- python3 购物车
今天干了啥?喂了喂龟,看了看鱼... 然后就是学习了两个模块:sys模块和os模块,突然觉得python真的好,只要英语学的好,看代码超级舒服的说,嗯,我要好好学英语,今天背了几个啥,唉.写完博客再背 ...