ES7-ES12

news/2024/9/8 4:00:50/

includes 

fromIndex 可选, 从fromIndex 索引处开始查找 valueToFind。如果为负值(即从末尾开始往前跳 fromIndex 的绝对值个索引,然后往后搜寻)。默认为 0。

arr.includes(valueToFind,[fromIndex])

想求2的10次方

console.log(Math.pow(2, 10)); // 1024
//或者
console.log(2 ** 10); // 1024

Object.getOwnPropertyDescriptors()

方法用来获取一个对象的所有自身属性的描述符。

const obj = {name: "jimmy",age: 18,
};
const desc = Object.getOwnPropertyDescriptors(obj);
console.log(desc);  
// 打印结果
{name: {value: 'jimmy',writable: true,enumerable: true,configurable: true},age: { value: 18, writable: true,enumerable: true, configurable: true }
}
  • value表示当前对象的默认值

  • writable表示对象属性是否可以修改

  • enumerable表示当前这个属性是否可以出现在对象的枚举属性中

  • configurable表示当前对象的属性能否用delete删除

那这些对象的属性我们怎么设置和修改他们呢,我们可以使用es5的 Object.defineProperty() 

const obj = {};
Object.defineProperty(obj, "name", {value: "jimmy",writable: true,configurable: true,enumerable: true,
});
Object.defineProperty(obj, "age", {value: 34,writable: true,configurable: true,enumerable: true,
});
console.log(obj); // { name: 'jimmy', age: 34 }
复制代码

padStart把指定字符串填充到字符串头部,返回新字符串。

'abc'.padStart(10);         // "       abc"
'abc'.padStart(10, "foo");  // "foofoofabc"
'abc'.padStart(6,"123465"); // "123abc"
'abc'.padStart(8, "0");     // "00000abc"
'abc'.padStart(1);          // "abc"

应用场景 :日期格式化:yyyy-mm-dd的格式

const now = new Date()
const year = now.getFullYear()
// 月份和日期 如果是一位前面给它填充一个0
const month = (now.getMonth() + 1).toString().padStart(2, '0')
const day = (now.getDate()).toString().padStart(2, '0')
console.log(year, month, day)
console.log( `${year}-${month}-${day}` ) //输入今天的日期 2021-12-31

数字替换(手机号,银行卡号等)

const tel = '18781268679'
const newTel = tel.slice(-4).padStart(tel.length, '*')
console.log(newTel) // *******5678

padEnd 把指定字符串填充到字符串尾部,返回新字符串(语法同上)

'abc'.padEnd(10);          // "abc       "
'abc'.padEnd(10, "foo");   // "abcfoofoof"
'abc'.padEnd(6, "123456"); // "abc123"
'abc'.padEnd(1);           // "abc"

ES8 允许函数的最后一个参数有尾逗号

async/await

async  标记函数为异步函数(返回Promise)

await   必需在async标记的函数里面执行,await标记的函数执行完才向下执行(reslove)

await后面的Promise对象不必写then,因为await的作用之一就是获取后面Promise对象成功状态传递出来的参数

function fn(){return new Promise(resolve=>{//不加Promise不生效setTimeout(()=>{console.log(111)resolve()//调用resolve后才会向下执行(执行fn2),向下执行的关键节点},3000)})
}
function fn2(){setTimeout(()=>console.log(222),2000)
}
async function fn3(){//标记函数为异步函数await fn()fn2()
}
fn3()
//输出结果:3s后输入111   2s后输出222

for-await-of

异步迭代器(for-await-of):循环等待每个Promise对象变为resolved状态才进入下一步。

for...of 是同步的

function TimeOut(time) {return new Promise(function(resolve, reject) {setTimeout(function() {resolve(time)}, time)})
}
async function test() {let arr = [TimeOut(2000), TimeOut(1000), TimeOut(3000)]for await (let item of arr) {console.log(Date.now(), item)}
}
test()
// 1560092345730 2000
// 1560092345730 1000
// 1560092346336 3000

Array.prototype.flat()

let newArray = arr.flat([depth])
  • depth 可选,指定要提取嵌套数组的结构深度,默认值为 1。

flat()  方法会按照一个可指定的深度递归遍历数组,并将所有元素合并为一个新数组返回。

const arr1 = [0, 1, 2, [3, 4]];
console.log(arr1.flat());  //  [0, 1, 2, 3, 4]
const arr2 = [0, 1, 2, [[[3, 4]]]];
console.log(arr2.flat(2));  //  [0, 1, 2, [3, 4]]//使用 Infinity,可展开任意深度的嵌套数组
var arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Infinity); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]// `flat()` 方法会移除数组中的空项:
var arr5 = [1, 2, , 4, 5];
arr5.flat(); // [1, 2, 4, 5]

 Array.prototype.flatMap()

先map  后 flat (深度为1)

var new_array = arr.flatMap(function callback(currentValue, index, array) {// 返回新数组的元素
}[, thisArg])

对比map 和flatMap

const numbers = [1, 2, 3]
numbers.map(x => [x * 2]) // [[2], [4], [6]]
numbers.flatMap(x => [x * 2]) // [2, 4, 6]  map后执行flat了
let arr = ['今天天气不错', '', '早上好']
arr.map(s => s.split(''))
// [["今", "天", "天", "气", "不", "错"],[""],["早", "上", "好"]]
arr.flatMap(s => s.split(''))
// ["今", "天", "天", "气", "不", "错", "", "早", "上", "好"]

String.prototype.trimStart() / String.prototype.trimEnd()

trimStart() 方法从字符串的开头删除空格,trimLeft()是此方法的别名。

let str = '   foo  '
console.log(str.length) // 8
str = str.trimStart() // 或str.trimLeft()
console.log(str.length) // 5

trimEnd() 方法从一个字符串的右端移除空白字符,trimRight 是 trimEnd 的别名。

异常捕获

//ES10以前捕获异常
try {// tryCode
} catch (err) {// catchCode
}//ES10之后,可以省略 err参数
try {console.log('Foobar')
} catch {console.error('Bar')
}

验证参数是否为json格式

const validJSON = json => {try {JSON.parse(json)return true} catch {return false}
}

globalThis

globalThis 提供了一个标准的方式来获取不同环境下的全局 this  对象(也就是全局对象自身)

Promise.allSettled()

Promise.all() 具有并发执行异步任务的能力。但如果其中某个任务出现异常(reject),所有任务都会挂掉,Promise直接进入reject 状态。

Promise.allSettled:并发任务中,无论一个任务正常或者异常,都会全部返回对应的的状态

逻辑运算符和赋值表达式(&&=,||=,??=)

x &&= y
//等价于
x && (x = y);x ||= y 
//等价于
x || (x = y);x ??= y 
//等价于
x ?? (x = y);
//仅在x为null或undefined时。对x进行赋值

数字分隔符

欧美语言中,较长的数值允许每三位添加一个分隔符(通常是一个逗号),增加数值的可读性。比如,1000可以写作1,000

ES2021中允许 JavaScript 的数值使用下划线(_)作为分隔符

let a= 1_000;
a=== 1000 // true

但JS中没有明确的位数,可以每三位添加一个分隔符,也可以每一位、每两位、每四位

123_00 === 12_300 // true
12345_00 === 123_4500 // true
12345_00 === 1_234_500 // true
// 全部报错
3_.141
3._141
1_e12
1e_12
123__456
_1464301
1464301_


http://www.ppmy.cn/news/131430.html

相关文章

前端ES系列

【 ES6~ES13】 文章目录 【 ES6~ES13】1、ES6常用的特性一.var、let、const之间的区别以及和闭包的关联二.箭头函数和普通函数的区别以及this的指向三.Promise1.简述Promise原理2.Promise的方法then,catch,finally3.async 和 await 四.Proxy 和defineProperty 以及两者区别使用…

ES7和 ES8 一览

ES7 Array.prototype.includes 在es5 或者 es6 中我们要判断数组中是否包含某个元素我们需要用到Array.prototype.indexOf,在es7中加入了 arr.includes(searchElement, fromIndex) 以前我们需要这么写 let arr [react, angular, vue] // Correct if (arr.indexOf(react) !…

ES7与ES8特性

我曾写过一篇关于ES6博客《10个最佳ES6特性》,这次我打算聊聊ES7和ES8特性。 ES7只有2个特性: includes()指数操作符 ES8尚未发布(2017年1月),下面是它已经完成起草的一些特性: Object.values()Object.entries()padStart()padEnd()Object…

ES7, ES8

文章目录 前言一、ES7(一) includes() 二、ES8(一)Object.values()1. 意义:遍历对象对的属性值,需要通过属性名key去获取属性值2. 例如:-->ES8前-->ES8后 (二)Obje…

Elasticsearch:使用标准 Java HTTP 的集成 - Elastic Stack 8.x

Elasticsearch 功能可以通过多种方式轻松集成到任何 Java 应用程序中,通过 REST API 或通过本机 API。 在 Java 中,很容易使用许多可用库之一调用 REST HTTP 接口,例如 Apache HttpComponents 客户端(有关更多信息,请参…

ES6, ES7, ES8, ES9 以及 ES10 新特征

目录 1. ES6 新特征 (2015) 1.1 module 1.1.1 export 1.1.2 import 1.2 Arrow function (箭头函数) 1.2.1 箭头函数结构 1.3 默认参数 1.4 模板字符串 1.5. 解构赋值 1.5.1数组的结构赋值 1.5.2 对象解构赋值 1.6 扩展运算符 1.7Promise(异步) 2 ES7新特征 (2016…

【ES】elasticsearch常见报错(服务端)

elasticsearch常见报错 _search 操作响应错误Cannot search on field [xxxxx] since it is not indexed.unknown type for collapse field ‘xxx’, only keywords and numbers are accepted _search 操作响应错误 Cannot search on field [xxxxx] since it is not indexed. …

ES新语法ES7、ES8、ES9、ES10新特性

ES7新特性 1.Array.prototype.includes()方法 //直观判断数组中是否包含一个元素,,如果包含则返回true,否则返回false。 const arr [1, 3, 5, 2, 8, NaN, -0] arr.includes(1) // true arr.includes(1, 2) // false 该方法的第二个参数表示搜索的起始…

ES6、ES7、ES8、ES9、ES10、ES11

目录 一、ES6 二、ES7 三、ES8 四、ES9 一、ES6 点击跳转 二、ES7 1.Includes方法:检测数组是否包含某个元素,返回布尔值 const mingzhu [西游记, 红楼梦, 三国演义, 水浒传]; console.log(mingzhu.includes(西游记)); // true console.log(min…

android系统能内存卡,手机SD卡可以作为内置存储吗? 安卓6.0将支持microSD卡作为内置存储...

过去不少厂商为了引导用户选择存储空间更大更昂贵的机型,纷纷取消了外置存储卡的功能。然而大部分用户自始至终都更青睐支持外置存储卡的手机,这也迫使手机厂商调整策略。现在就连一向排斥外置存储卡的谷歌也在安卓6.0中加入了将外置存储卡作为内置存储的…

linux检测扩容卡,TF内存卡是不是扩容卡准确质量检测

如果你花了很少的钱买了一个非常大容量的内存卡,那么就要小心了,你可能买到的是一个扩容的内存卡,所谓扩容就是说容量的虚拟的,真实容量可能只有一成不到,比如64G的内存卡,实际容量可能只有4G,那…

linux检测扩容卡,教你检测SD卡内存卡是否被扩容过的方法

新购买一个便宜的内存卡,使用一段时间后,发现不能存东西了,或者不能再读了,怎么回事呢?其实发生这些问题就是SD卡内存卡烧了。其实很多人购买便宜内存卡多半是扩容的,实际容量不到标称容量的1/4。那么如何检…

android 手机存储位置设置,如何将红米手机外置SD卡设定为默认存储

在国产机中,小米的地位越来越具优势,低价高配已经成为了小米手机的代言词,799元的红米手机最能说明问题,红米手机已经销售了有一段时间了,随之而来的一些小问题让用户有些头疼,其中包括无法将外置SD卡设定为…

手机闪存速度排行_手机很卡可能是只是因为闪存颗粒太差 EMMC UFS大对比

原标题:手机很卡可能是只是因为闪存颗粒太差 EMMC UFS大对比 在经历了华为的“闪存门”事件以后,人们都开始关注关于手机内存的相关知识。那么所谓的EMMC和UFC到底有什么差别,那一个更好一些呢?接下来我们将仔细讲解。 大众了解到…

用计算机读取机读卡信息,摄像机SD卡无法读取怎么办

一般用摄像机摄像的时候都是在发生比较有纪念意义的事情的时候,但是摄像完后把SD数据拷出来,却发现SD卡不能读取了,怎么办?相信,如果遇到这个问题的网友一定会急的像热锅上的蚂蚁。下面我们就来讨论下如果遇到这种问题了的解决办法。 先确认是SD卡的问题还是摄像机的问题。…

苹果电脑更改sd卡只读_SD内存卡禁止写入只读怎么办?另类SPI模式修复坏卡

这几天很郁闷,买的32G TF卡老出问题,三星的标,不知道是不是正品,标称C10,且不说是不是真的三星和真的C10,反正测试一下容量倒是真的,价格么也比较亲民,好像是69块? 哎,可惜呀,好景不长,坏了,变只读了。 这卡一直放老婆手机里用,上周突然手机不正常了,各种怪异…

适合手机运行的服务器系统,同样2GB内存 手机为啥不如电脑运行好?

电子设备流畅的运行,直接影响到用户的应用体验,应用体验是一个新兴的概念,但却是衡量电子设备优劣的一个重要指标,对电子产品的购买产生着直接的影响。 影响电子设备应用体验最直接因素就是硬件配置,相同的配置也有可能有不同的应用体验。在ZOL官方论坛中,就有多个网友提…

android+复制大文件,手机SD卡无法复制拷贝大文件的解决方法

现在的SD存储卡越来越便宜了,一个32G的价格在去年只能买到16G的,所以很多朋友都上了32G甚至更大的卡。但是很囧的情况发生了,这么大的存储卡居然不能复制大文件,相信很多朋友都碰到过这种囧事吧,还以为是SD卡的问题,其实吧,就是SD卡的问题,不过可能不是质量问题,而是它…

电脑tf卡检测不到_内存卡在电脑上读不出来怎么办 内存卡在电脑上读不出来解决方法【详细介绍】...

在如今科技产品众多的信息时代里,内存卡对于我们而言并不陌生。内存卡一般多用于手机、电脑、相机等产品上所能够独立存储的介质。不仅具有很好的兼容性,而且在不同的数码产品之间可以进行数据的交换。随着使用时间的增加,以及我们偶尔的操作不对加上内存卡本身的质量问题,…

root卡顿解决方法,手机root后很卡

手机root后屏卡顿 相机卡屏 系统更新出错,求解 楼主你好! 下面的流程是手机root后屏卡顿相机卡屏系统更新出错的解决方法! 1、如果用一些软件root之后已经造成了卡顿及掉相机问题,可以使用RE文件管理器先删除 /system/app 下的授权…