es10

csxiaoyaojianxian · csxiaoyaojianxian · commit 3b0e603d2ee5 · 2020-03-15T21:30:02.000+08:00
diff --git a/01-JS语言基础/数据格式处理/01-正则表达式.html b/01-JS语言基础/数据格式处理/01-正则表达式.html
@@ -47,7 +47,7 @@
 reg.compile(reg);
 
 // 【 3 字符串方法 】
-// match() 根据正则表达式去查找字符串符合规则的内容，返回数组，没有匹配项返回null
+// match() / matchAll() 根据正则表达式去查找字符串符合规则的内容，返回数组，没有匹配项返回null
 console.log(str.match(reg));// ["sun", "jian", "feng"]
 // replace()
 console.log("sunjianfeng".replace(/jianfeng/,"shine"));//sunshine
diff --git a/01-JS语言基础/数据类型与转换/String.html b/01-JS语言基础/数据类型与转换/String.html
@@ -48,9 +48,10 @@
     【 String.raw() 】转义字符串
 
     【 es6 tag 函数 & template literals 】
-
-    【 es8 】
+【 es8 】
     * 【 padStart(), padEnd() 】字符串补全，比如统一数据前置0
+【 es10 】
+    【 trimLeft() / trimRight() / trimStart() / trimEnd() 】
 
 4.【简单综合应用1】字符串占位
 
@@ -291,27 +292,39 @@
     /**
      * 【 模板字符串 】
      */
+    /*
+    const basket = {
+        count: 0,
+        onSale: ['good1', 'good2']
+    }
     `There are <b>${basket.count + 1}</b> items
     in your basket, <em>${basket.onSale}</em>${f()}
     are on sale!`
     // 标签模板
     alert`Hello world!`; // 等价于 alert('Hello world!')
     f`My Name is ${name},I am ${age+1} years old next year.`; // 等价于 f(['My Name is',',I am ',' years old next year.'],'Mike',28)
+    */
+
     /**
      * 【 String.raw() 】
      * 转义字符串
      */
 
      /**
-     * 【 padStart(), padEnd() 】
-     * 字符串不够指定长度，在头部或尾部补全
-     */
+      * 【 padStart(), padEnd() 】
+      * 字符串不够指定长度，在头部或尾部补全
+      */
     'x'.padStart(4, 'ab') // 'abax'
     'x'.padEnd(5, 'ab') // 'xabab'
     'abc'.padStart(10, '0123456789') // '0123456abc'
     'x'.padEnd(4) // 'x   '
     '7'.padStart(3, '0') // '007'
-    
+
+    /**
+     * 【 trimLeft() / trimRight() / trimStart() / trimEnd() 】
+     */
+    let strTrim = '   foo   ' // strTrim.replace(/^\s+|\s+$/g, '')
+    console.log(strTrim.trimStart()) // 'foo   '
 
 //【简单综合应用1】字符串占位
     var str = "CS逍遥剑仙 www.csxiaoyao.com";
diff --git a/02-ES新特性/06-String字符串.html b/02-ES新特性/06-String字符串.html
diff --git a/02-ES新特性/09-Array数组.html b/02-ES新特性/09-Array数组.html
@@ -22,7 +22,7 @@
 // keys()            遍历键名
 // values()          遍历键值
 // includes()        数组是否包含指定值（es7）
-// flat()            嵌套数组转一维数组
+// flat()            嵌套数组转一维数组 (es10)
 // flatMap()         遍历元素再对数组执行 flat() 方法
 // ...               复制 / 合并数组
 // 数组缓冲区 ArrayBuffer / DataView
@@ -146,7 +146,7 @@
 console.log([...[,'a'].values()]); // [undefined, "a"] 数组含空位
 
 /**
- * es6 数组包含
+ * es7 数组包含
  */
 // 【 includes() 】 数组是否包含指定值
 //     注意：与 Set 和 Map 的 has 方法区分：Set 的 has 方法用于查找值；Map 的 has 方法用于查找键名。
@@ -157,18 +157,20 @@
 [1, NaN, 3].includes(NaN); // true
 
 /**
- * es6 嵌套数组转一维数组
+ * es10 嵌套数组转一维数组
  */
 // 【 flat() 】 嵌套数组转一维数组
 console.log([1 ,[2, 3]].flat()); // [1, 2, 3]
 console.log([1, [2, , 3]].flat()); // [1, 2, 3] 自动跳过空位
 //     指定转换的嵌套层数
 console.log([1, [2, [3, [4, 5]]]].flat(2)); // [1, 2, 3, [4, 5]]
 console.log([1, [2, [3, [4, 5]]]].flat(Infinity)); // [1, 2, 3, 4, 5]
-// 【 flatMap() 】 先对数组中每个元素进行处理，再对数组执行 flat() 方法
+// 【 flatMap() 】 flat + map 先对数组中每个元素进行处理，再对数组执行 flat() 方法
 //     参数1：遍历函数，该遍历函数可接受3个参数：当前元素、当前元素索引、原数组
 //     参数2：指定遍历函数中 this 的指向
 console.log([1, 2, 3].flatMap(n => [n * 2])); // [2, 4, 6]
+// 相当于
+console.log([1, 2, 3].map(n => [n * 2]).flat()); // [[2], [4], [6]] => [2, 4, 6]
 
 /**
  * 扩展运算符
diff --git a/02-ES新特性/18-ES10-JSON.html b/02-ES新特性/18-ES10-JSON.html
@@ -0,0 +1,24 @@
+<!--
+* @Author: victorsun
+* @Date: 2020-03-15 19:31:39
+ * @LastEditors: victorsun - csxiaoyao
+ * @LastEditTime: 2020-03-15 19:34:01
+* @Description: sunjianfeng@csxiaoyao.com
+-->
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>es</title>
+</head>
+<body>
+<script>
+/**
+ * ES10
+ */
+// 1. JSON bug 修复
+console.log(JSON.stringify('\u{D800}')) // 不报错了
+</script>
+</body>
+</html>
diff --git a/02-ES新特性/19-ES10-BigInt.html b/02-ES新特性/19-ES10-BigInt.html
@@ -0,0 +1,25 @@
+<!--
+* @Author: victorsun
+* @Date: 2020-03-15 19:31:39
+ * @LastEditors: victorsun - csxiaoyao
+ * @LastEditTime: 2020-03-15 20:44:11
+* @Description: sunjianfeng@csxiaoyao.com
+-->
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>es</title>
+</head>
+<body>
+<script>
+/**
+ * ES10
+ */
+const a = 11n
+typeof a // bigint
+typeof 11 // number
+</script>
+</body>
+</html>
