ES6新增常用方法
字符串新增方法
padStart
、padEnd
如果原字符串不够指定长度,则会在左侧(右侧)填充字符串,用以补全
padStart( length: number, fillStr?: string )
padEnd( length: number, fillStr?: string )
参数 是否必选 描述 length
true 指定的长度 fillStr
true 要填充的字符串
let str = 'Hello'
console.log(str.padStart(10, 'ha')); //hahahHello
console.log(str.padEnd(10, 'ha')); //Hellohahah
repeat()
- 将原字符串重复n次后返回
repeat (count: number)
let str = 'Hello'
console.log(str.repeat(3)); //HelloHelloHello
includes(), startsWith(), endsWith()
includes()
:判断一个字符串是否包含在另一个字符串中startsWith()
:判断一个字符串是否在另一个字符串头部endsWith()
:判断一个字符串是否在另一个字符串尾部startsWith(searchString: string, position?: number)
参数 是否必选 描述 searchString
true 要搜索的字符串 position
false 要搜索的起始索引
let s = 'Hello world!';
console.log(s.includes('wo')) //true
console.log(s.startsWith('el')); //false
console.log(s.startsWith('el', 1)); //true
console.log(s.endsWith('d')); //false
数组新增方法
Array.from
将其他数据类型转换为数组
其它数据类型包括所有可遍历的字符串、Set、Map等
Array.from(iterable: Iterable | ArrayLike): any[]
参数 是否必选 描述 iterable
true 用于遍历的对象 ArrayLike
false 数组中每个元素需要调用的函数,类似于map()
let str = 'Hello'
console.log(Array.from(str, v => v + 2)); //[ 'H2', 'e2', 'l2', 'l2', 'o2' ]
map()
、filter()
、every()
、some()
、find()
、findIndex()
map()
:传入一个回调函数,将原数组映射成一个新数组filter
:过滤器。传入一个回调函数,对原数组的每一项按照相同规则做一些转变后返回。every()
:判断数组中是否每一项都符合条件some()
:判断数组中是否有一项符合条件find()
:找到满足条件的一个值立即返回findIndex()
:找到满足条件的一个值的索引,立即返回array.filter(function(currentValue,index,arr), thisValue)
参数 描述 currentValue
true 当前元素的值 index
false 当前元素的索引值 arr
false 原数组 thisValue
false 用作 this
的值,省略则this
为undefined
let arr = [1, 5, 7, 3, 2]
let res1 = arr.map((value, index, originArr) => {
return index % 2 === 0 ? value * 2 : value * 3
})
let res2 = let res1 = arr.filter(item => item > 3)
let res3 = arr.every(item => item > 3)
let res4 = arr.some(item => item > 3)
let res5 = arr.find(item => value > 5)
let res6 = arr.findIndex(item => value > 5)
console.log(res1); //[ 2, 15, 14, 9, 4 ]
console.log(res2); //[ 5, 7 ]
console.log(res3); //false
console.log(res4); //true
console.log(res5); //7
console.log(res6); //2
reduce()
传入一个回调,对原数组每一项累加求和
array.reduce(function(total,currentValue,currentIndex,arr), initialValue)
参数 是否必选 描述 total
true 初始值, 或者计算结束后的返回值。 currentValue
true 当前元素的值 currentIndex
false 当前元素的索引 arr
false 原数组 initialValue
false 初始值。默认为0
let arr = [1, 5, 7, 3, 2]
let num = arr.reduce((total, pre) => total + pre)
console.log(num); //18
forEach()
循环-迭代
array.forEach(function(currentValue, index, arr), thisValue)
参数 是否必选 描述 currentValue
true 当前元素 index
false 当前元素的索引值 arr
false 原数组
let arr = [1, 5, 7, 3, 2]
arr.forEach(item => console.log(item)) //1 5 7 3 2
对象新增方法
Object.assign()
合并对象,将后面的对象合并到第一个对象中;
Object.assign(目标对象, 源对象1,源对象2,...)
同名属性覆盖,不同名属性新增,后面的覆盖前面的
基本数据类型作为源对象时会自动转换为对象再合并
let KangKang = {
age: 24,
name:'kangkang'
}
let Maria = {
age: 21,
name: 'maria',
gender: 'female'
}
let Jane = {
name: 'jane'
}
console.log(Object.assign(KangKang, Maria, Jane)); //{ age: 21, name: 'jane', gender: 'female' }
Object.keys ()
、Object.value()
、Object.entries ()
Object.keys()
:获取对象中属性名的集合Object.value()
:获取对象中属性值的集合Object.entries ()
:获取对象中属性名和属性值的集合
let Maria = {
age: 21,
name: 'maria',
gender: 'female'
}
console.log(Object.keys(Maria)); //[ 'age', 'name', 'gender' ]
console.log(Object.values(Maria)); //[ 21, 'maria', 'female' ]
console.log(Object.entries(Maria)); //[ [ 'age', 21 ], [ 'name', 'maria' ], [ 'gender', 'female' ] ]
后续补充……
ES6新增常用方法的更多相关文章
- es6新增
首先要说let,他是只在代码块中执行的变量,例如: { let a = 10; var b = 1;}console.log(a);//definedconsole.log(b);//1 ...
- ECMAScript简介以及es6新增语法
ECMAScript简介 ECMAScript与JavaScript的关系 ECMAScript是JavaScript语言的国际化标准,JavaScript是ECMAScript的实现.(前者是后者的 ...
- ES6新增的常用数组方法(forEach,map,filter,every,some)
ES6新增的常用数组方法 let arr = [1, 2, 3, 2, 1]; 一 forEach => 遍历数组 arr.forEach((v, i) => { console.log( ...
- ES6新增对象方法的访问描述符:get(只读)、set(只写)
Es6新增对象方法的访问描述符:get(只读).set(只写),可以直接使用,一般用于数据监听,用途类似于vue.$watch. var obj = { a:1, get bar() { return ...
- 浅谈ES6新增数据类型:Symbol
面试中喜闻乐见的问题就是问我们的ES6新增了哪些个新特性 这篇文章一起学习一下新增的数据类型:Symbol JS的原始数据类型:6种Boolean,String,Undefined,NULL,Numb ...
- ES6新增的数据类型Map和Set。
Javascript的默认对象表示方式 {} ,即一组键值对. 但是Javascript的对象有个小问题,就是键必须是字符串.但实际上Number或者其他数据类型作为键也是非常合理的. 为了解决这个问 ...
- es6 新增字符串方法
es6新增了4个字符串处理的方法:startsWith,endsWith,includes,repeat. 1.简单使用 includes()返回布尔值,表示是否找到了参数字符串 startsWith ...
- es6新增功能
声明命令 1. let命令 ES6新增了let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效.下面代码在代码块之中,分别用let和var声明了两个变量.然 ...
- ES6 新增的一些东西
一.常量 不允许重复定义 const a='HELLO' const a='world'//报错Uncaught SyntaxError: Identifier 'a' has already bee ...
随机推荐
- C#无边框窗体拖动代码
1.重写 protected override void WndProc(ref Message m) { if (m.Msg == 163 && this.ClientRectang ...
- IPFS矿机封装原理解释
近期无论是从媒体.新闻的高度曝光,还是市场拓展的覆盖度来看,IPFS 俨然成为今年最值得关注的行业话题与入场趋势.对于许多刚了解 IPFS 的小白来说,矿机的「封装」.「有效算力」和「原值算力」这些概 ...
- 回忆那些年我玩过的ide,看看哪些你也玩过,看图回忆
闲来无聊,回忆一下这些年玩过的ide.看看哪些你也玩过. QBasic 第一个ide,兴奋程度也是最大的,从此进入了码农行列 VisualBasic 可以拖界面了,成就感爆棚 Turbo C c语言, ...
- 力扣 - 92. 反转链表II
目录 题目 思路1(迭代) 代码 复杂度分析 思路2(递归) 代码 复杂度分析 题目 92. 反转链表 II 思路1(迭代) 将反转链表分成3个部分:前一段未反转的部分.待反转链表部分.后一段未反转部 ...
- Python—关于Pandas缺失值问题(国内唯一)
获取文中的CSV文件用于代码编程以及文章首发地址,请点击下方超链接 获取CSV,用于编程调试请点这 在本文中,我们将使用Python的Pandas库逐步完成许多不同的数据清理任务.具体而言,我们将重点 ...
- 基于SageMath的数学网站——本科毕业开发项目
1 绪论 1.1研究背景 我国是一个拥有15亿人口的大国.其中,据2017年的统计,全国共有大学生2600万左右.如此数量众多的大学生,都会有着学习基础数理课程的需求.而在高校的数学教学中,教授最多最 ...
- (数据科学学习手札116)Python+Dash快速web应用开发——交互表格篇(中)
本文示例代码已上传至我的Github仓库https://github.com/CNFeffery/DataScienceStudyNotes 1 简介 这是我的系列教程Python+Dash快速web ...
- 201871030107-常雅伦 实验三 结对项目—《D{0-1}KP 实例数据集算法实验平台》项目报告
项目 内容 课程班级博客链接 班级博客 这个作业要求链接 作业要求 我的课程学习目标 1.体验软件项目开发中的两人合作,练习结对编程(Pair programming).2.掌握Github协作开发程 ...
- Leedcode算法专题训练(二分查找)
二分查找实现 非常详细的解释,简单但是细节很重要 https://www.cnblogs.com/kyoner/p/11080078.html 正常实现 Input : [1,2,3,4,5] key ...
- Cobalt Strike使用教程一
Cobalt Strike使用教程一 0x00 简介 Cobalt Strike是一款基于java的渗透测试神器,常被业界人称为CS神器.自3.0以后已经不在使用Metasploit框架而作为 ...