【第一课:ES发展历史】
*******************************************************************************
*******************************************************************************
ES -> ECMA标准
ES6 -> 2015年6月 ES6.0
ESnext ->下一代js语言
标准委员会(TC39)要求更改语言标准
提案->标准
Stage 0 展示阶段
Stage 1 征求意见阶段
Stage 2 草案阶段
Stage 3 候选阶段
Stage 4 定案阶段(标准)
【第二课:let,const】
*******************************************************************************
*******************************************************************************
定义(声明)变量
ES5 作用域>>>>>函数作用域:
<script>
function fn() {
for (var i = 0; i < 10; i++) {
console.log(i)
}
}
fn();
</script>
ES5 作用域>>>>>全局用域:
<script>
for (var i = 0; i < 10; i++) {
//console.log(i)
}
console.log(i);
</script>
特性>>>>>预解析,变量提升
<script>
console.log(i);
var i = 1;
</script>
打印:undefined(语法未出现错误)
特性>>>>>同一作用域里面可以定义相同变量
<script>
var i = 1;
var i = 2;
console.log(i);
</script>
打印:2;赋值被重写掉。
ES6 作用域>>>>>块级作用域 {}
特性>>>>>没有预解析,不存在变量提升;先定义后使用
<script>
let i= 1;
console.log(i);
</script>
特性>>>>>统一作用域里面只能定义一次变量,不能重复定义变量
<script>
let i = 1;
let i = 2;
console.log(i);
</script>
Uncaught SyntaxError: Identifier 'i' has already been declared
特性>>>>>for循环时类似于一个父级作用域
<script>
for (let i = 0; i < 10; i++) {
console.log(i);
}
{
let i = 100;
console.log(i);
{
console.log(i);
{
let i = 111;
console.log(i);
}
}
}
</script>
Const 定义变量特性和let一致,但定义的变量不可修改。
<script>
const arr = ["a","b", "c"];
arr = ["a"];
console.log(arr);
</script>
ES6.html:11 Uncaught TypeError: Assignment to constant variable.
但满足对象的基本特性:
<script>
const arr = ["a","b", "c"];
arr.push("d");
console.log(arr);
</script>
(4) ["a", "b", "c", "d"]
【第三课:解构赋值】
*******************************************************************************
*******************************************************************************
常规应用解构赋值
<script>
{
let [a, b, c] = ["a", "b", "c"];
console.log(a, b, c);
//a b c
}
{
let [a, b, c] = ["a", "b"];
console.log(a, b, c);
//a b undefined
}
{
let [a, [b, c]] = ["a", ["b"]];
console.log(a, b, c);
//a b undefined
}
{
//交换位置
// let a = "a";
// let b = "b";
let [a, b] = ["a", "b"];
[a, b] = [b, a]
console.log(a, b);
//b a
}
{
//json解构赋值
let json = {
age: 12,
name: "姓名",
sex: "男"
};
let { name, age, sex } = json;//注意为花括号,两边对象格式一致
console.log(age, name, sex);
//12 "姓名" "男"
}
//解构赋值重命名
{
let json = {
age: 12,
name: "姓名",
sex: "男"
};
let { name: name_a, age: age_b, sex: sex_c } = json;//注意为花括号,两边对象格式一致
console.log(name_a, age_b, sex_c);
//姓名 12 男
}
//解构赋值初始值(默认值undefined)
{
let json = {
age: 12,
name: "姓名",
//sex : undefined
};
let { name: name_a, age: age_b, sex: sex_c = "暂无性别" } = json;//注意为花括号,两边对象格式一致 默认值只针对于undefined情况
console.log(name_a, age_b, sex_c);
//姓名 12 暂无性别
}
//解构赋值初始值(默认值null)
{
let json = {
age: 12,
name: "姓名",
sex: null
};
let { name: name_a, age: age_b, sex: sex_c = "暂无性别" } = json;//注意为花括号,两边对象格式一致
console.log(name_a, age_b, sex_c);
//姓名 12 null
}
</script>
函数应用:
<script>
{
function fn() {
return { a: 1, b: 2 };
}
let { a, b } = fn();
console.log(a, b);
//1 2
}
{
function fn() {
return { a: 1 };
}
let { a, b: temp_b = "暂无数据" } = fn();
console.log(a, temp_b);
//1 "暂无数据"
}
{
function fn({ a, b }) {
console.log(a, b);
}
fn({ a: 1, b: 2 });
//1 2
}
{
function fn({ a, b ="暂无数据" }) {
console.log(a, b);
}
fn({ a: 1 });
//1 "暂无数据"
}
{
function fn({ a="a暂无数据", b ="b暂无数据" }) {
console.log(a, b);
}
fn({ });
//a暂无数据 b暂无数据
}
{
function fn({ a="a暂无数据", b ="b暂无数据" }={}) {
console.log(a, b);
}
fn();
//a暂无数据 b暂无数据
}
</script>
【第四课:字符串模板及新增函数】
*******************************************************************************
*******************************************************************************
字符串模板:波浪线反飘符号。``
<script>
{
let [title, count] = ["ES6学习案例", 100];
let str = `标题${title};浏览次数${count};`;
console.log(str);
//标题ES6学习案例;浏览次数100;
}
{
//新增字符串函数
let str = "apple orange pear panda";
let str1 = "123";
console.log(str.includes("app"));
//true
console.log(str.startsWith("app"));
//true
console.log(str.endsWith("app"));
//false
console.log(str1.padStart(10, "x"));
//xxxxxxx123
console.log(str1.padStart(10, "xa"));
//xaxaxax123
console.log(str1.padEnd(10, "x"));
//123xxxxxxx
console.log(str1.padEnd(10, "xa"));
//123xaxaxax
}
</script>
【第五课:函数默认参数、箭头函数、剩余参数】
*******************************************************************************
*******************************************************************************
函数默认参数
<script>
{
function fn() {
return { a: 1, b: 2 };
}
let { a, b } = fn();
console.log(a, b);
//1 2
}
{
function fn() {
return { a: 1 };
}
let { a, b: temp_b = "暂无数据" } = fn();
console.log(a, temp_b);
//1 "暂无数据"
}
{
function fn({ a, b }) {
console.log(a, b);
}
fn({ a: 1, b: 2 });
//1 2
}
{
function fn({ a, b = "暂无数据" }) {
console.log(a, b);
}
fn({ a: 1 });
//1 "暂无数据"
}
{
function fn({ a = "a暂无数据", b = "b暂无数据" }) {
console.log(a, b);
}
fn({});
//a暂无数据 b暂无数据
}
{
function fn({ a = "a暂无数据", b = "b暂无数据" } = {}) {
console.log(a, b);
}
fn();
//a暂无数据 b暂无数据
}
{
//函数参数默认已经定义,不可再次使用let,const声明定义
function fn(a = 1) {
let a = 2;
console.log(a);
}
//Uncaught SyntaxError: Identifier 'a' has already been declared
}
</script>
…及剩余参数
<script>
{
function fn(a){
console.log(...a);//将数组展开
}
fn([1,2,3,4,5]);
//1 2 3 4 5
}
{
function fn(...a){
console.log(a);//将散数合并成数组
}
fn(1,2,3,4,5);
//[1 2 3 4 5]
}
{
function fn(a,b,...c){
console.log(c);//将散数合并成数组
}
fn(1,2,3,4,5); //...c表示剩余参数,只能放在最后一个参数位置
//[3 4 5]
}
</script>
箭头函数
<script>
{
let fn = () => { return 1 }
console.log(fn());
//1
}
{
let fn = (a,b) => { return a+b }
console.log(fn(2,3));
//5
}
{
let fn = (a,b) => { return `标题${a};浏览次数${b}。`; }
console.log(fn("ES学习案例",30));
//标题ES学习案例;浏览次数30。
}
{
// this问题, 定义函数所在的对象,不在是运行时所在的对象
let json = {
id : 1,
fn :function(){
setTimeout(() => {
console.log(this.id);
}, 2000);
}
}
json.fn();
}
</script>
Ps注意事项:
1. this问题, 定义函数所在的对象,不在是运行时所在的对象
2. 箭头函数里面没有arguments, 用 ‘...’
3. 箭头函数不能当构造函数
【第六课:数组循环】
*******************************************************************************
*******************************************************************************
<script>
{
//for循环、
let arr = [1, 2, 3, 4, 5];
for (let i = 0; i < arr.length; i++) {
console.log(arr[i])
}
}
{
//forEach 代替普通for,无返回值不需要return
let arr = [1, 2, 3, 4, 5];
arr.forEach(function (value, idnex, arr) { console.log(value) });
}
{
//forEach 代替普通for,无返回值不需要return
let arr = [1, 2, 3, 4, 5];
arr.forEach((value, idnex, arr) => { console.log(value) });
}
{
//map
//非常有用,做数据交互 "映射"
//正常情况下,需要配合return,返回是一个新的数组
//若是没有return,相当于forEach
//注意:平时只要用map,一定是要有return
let arr = [{ title: "title1", hot: 10 }, { title: "title2", hot: 20 }, { title: "title3", hot: 30 }];
let newArr = arr.map((val, idnex, arr) => { return val.hot > 10 });
//重新整理数据结构
let newArr1 = arr.map((val, idnex, arr) => { return `主题为${val.title};热度为${val.hot}。` });
console.log(newArr);
console.log(newArr1);
// [false, true, true]
//["主题为title1;热度为10。", "主题为title2;热度为20。", "主题为title3;热度为30。"]
}
{
//filter 过滤,过滤一些不合格“元素”, 如果回调函数返回true,就留下来
let arr = [{ title: "title1", hot: 10 }, { title: "title2", hot: 20 }, { title: "title3", hot: 30 }];
let newArr = arr.filter((val, idnex, arr) => { return val.hot > 10 });
console.log(newArr);
//0: { title: "title2", hot: 20 }
//1: { title: "title3", hot: 30 }
}
{
//arr.some(): 类似查找, 数组里面某一个元素符合条件,返回true
let arr = [1, 3, 5, 7, 9, 10];
let res = arr.some((val, index, arr) => { return val % 2 == 0 });
console.log(res);
//true
}
{
//arr.every(): 类似查找, 数组里面某一个元素符合条件,返回true
let arr = [1, 3, 5, 7, 9, 10];
let res = arr.every((val, index, arr) => { return val % 2 == 0 });
console.log(res);
//false
}
{
//arr.reduce() 从左往右 求数组的和、阶乘
let arr = [2, 2, 3];
let res = arr.reduce((prev, cur, index, arr) => { return prev * cur });
let res1 = arr.reduce((prev, cur, index, arr) => { return prev ** cur });//幂运算
console.log(res);
console.log(res1);
//12
//64
}
{
//arr.reduce() 从右往左 求数组的和、阶乘
let arr = [2, 2, 3];
let res = arr.reduceRight((prev, cur, index, arr) => { return prev * cur });
let res1 = arr.reduceRight((prev, cur, index, arr) => { return prev ** cur });
console.log(res);
console.log(res1);
//12
//81
}
{
//for...of...类似于普通for
//但新增了arr.keys() 数组下标
// arr.entries() 数组某一项
let arr = [2, 2, 3];
for (let val of arr) {
console.log(val);
}
for (let val of arr.keys()) {
console.log(val);
}
for (let [key,val] of arr.entries()) {
console.log(key,val);
}
}
</script>
【第七课:数组新增特性】
*******************************************************************************
*******************************************************************************
<script>
{
//扩展运算符...
let arr1 = [1, 2, 3];
let arr2 = [...arr1];
console.log(arr2);
//(3) [1, 2, 3]
}
{
//Array.from();
//作用: 把类数组(获取一组元素、arguments...) 对象转成数组
//个人观点: 具备 length这个东西,就靠谱
let arr1 = [1, 2, 3];
let arr2 = Array.from(arr1);
console.log(arr2);
//[1, 2, 3]
let str = "123";
console.log(Array.from(str));
//["1", "2", "3"]
let json = {
0: "name1",
1: "男",
2: 18,
length: 3
};
console.log(Array.from(json))//json key比较特殊
// ["name1", "男", 18]
let json1 = {
0: "name1",
1: "男",
2: 18,
length: 2
};
console.log(Array.from(json1))//json key比较特殊
// ["name1", "男"]
}
{
//Array.of(): 把一组值,转成数组
let arr = Array.of("1", "2", "3");
console.log(arr);
//["1", "2", "3"]
}
{
//arr.find(): 查找,找出第一个符合条件的数组成员,如果没有找到,返回undefined
let arr = [10, 20, 30];
console.log(arr.find((val, index, arr) => { return val > 10 }));
}
{
//arr.findIndex(): 找的是第一个符合条件位置, 没找到返回-1
let arr = [10, 20, 30];
console.log(arr.findIndex((val, index, arr) => { return val > 10 }));
}
{
//arr.fill() 填充
//arr.fill(填充的东西, 开始位置, 结束位置);
let arr = [10, 20, 30];
arr.fill([1, 2, 3, 4], 1);
console.log(arr);
}
{
//在ES2016里面新增:
//arr.indexOf()
//arr.includes()
let arr = [10, 20, 30];
let res = arr.includes(20);
console.log(res);
//true
}
</script>
【第八课:对象简洁语法及对象新增】
*******************************************************************************
*******************************************************************************
对象简洁语法
<script>
{
let name = "name1";
let sex = "男";
let age = 18
let json1 = {
name: name,
sex: sex,
age: age
}
console.log(json1);
let json2 ={
name,
sex,
age
};
console.log(json2);
//json2 为json1 的简介语法
//Object age: 18name: "name1"sex: "男"
//Object age: 18name: "name1"sex: "男"
}
</script>
对象新增特性
两个对象是否相等Object.is()新增
<script>
{
//判断两个对象是否相等Object.is()新增对NaN以及+0,-0的处理
console.log(NaN == NaN);
//false
console.log(NaN===NaN);
//false
console.log(Number.isNaN(NaN));
//true
console.log(Object.is(NaN,NaN));
//true
console.log(Object.is(+0,-0));
//false
console.log(+0==-0);
//true
console.log(+0===-0);
//true
}
</script>
Object.assign():合并对象
let 新的对象 = Object.assign(目标对象, source1, srouce2....)
<script>
{
let json1 = { a: 1 };
let json2 = { b: 2 };
let json3 = { c: 3 };
let json4 = { d: 4, a: 4 };
let newJson1 = Object.assign({}, json1, json2, json3);
let newJson2 = Object.assign({}, json1, json2, json3, json4);
console.log(newJson1);
//{a: 1, b: 2, c: 3}
console.log(newJson2);
//{a: 4, b: 2, c: 3, d: 4} //a变成4,覆盖前面的值
}
</script>
对象新增函数属性
<script>
{
//对象新增属性
//ES2017引入:
//Object.keys()
//Object.entries();
//Object.values();
var json = { a: 1, b: 2, c: 3 };
for (let key of Object.keys(json)) {
console.log(key);
}
//a
//b
//c
for (let val of Object.values(json)) {
console.log(val);
}
//1
//2
//3
for (let item of Object.entries(json)) {
console.log(item);
}
//(2) ["a", 1]
//(2) ["b", 2]
//(2) ["c", 3]
for (let [key, val] of Object.entries(json)) {
console.log(key, val);
}
//a 1
//b 2
//c 3
//对象的扩展函数... 拷贝json对象
let json1 = {...json};
console.log(json1);
//{a: 1, b: 2, c: 3}
}
</script>
【第九课:Promise】
*******************************************************************************
*******************************************************************************
<script>
//Promise
//承诺,许诺 作用: 解决异步回调问题
//语法:
//let promise = new Promise(function(resolve, reject){
// //resolve, 成功调用
// //reject 失败调用
//});
//promise.then(res=>{
//
//}, err=>{
//
//})
//promise.catch(err => { })
{
let status = 2
let promise = new Promise(function (resolve, reject) {
if (status == 1) {
resolve("成功了");
} else {
reject("失败了");
}
})
promise.then(res => {
console.log(res);
},err=>{
console.log(err);
})
//promise.catch(err=>{console.log(err)});
}
//简洁用法
//new Promise().then(res=>{
//}).catch(err=>{
//})
{
let status = 1;
new Promise(function (resolve, reject) {
if (status == 1) {
resolve("成功了");
} else {
reject("失败了");
}
}).then(res=>{console.log(res)}).catch(err=>{console.log(err)});
}
//Promise.resolve('aa') : 将现有的东西,转成一个promise对象, resolve状态,成功状态
//等价于:
//new Promise(resolve =>{
// resolve('aaa')
//});
{
Promise.resolve("111").then(res=>{console.log(res)}).catch(err=>{console.log(err)});;
new Promise((resolve,reject)=>{
resolve("111");
}).then(res=>{console.log(res)}).catch(err=>{console.log(err)});
}
//Promise.reject('aaa'): 将现有的东西,转成一个promise对象,reject状态,失败状态
//等价于:
//new Promise((resolve, reject) =>{
// reject('aaa')
//});
{
Promise.reject("222").then(res=>{console.log(res)}).catch(err=>{console.log(err)});;
new Promise((resolve,reject)=>{
reject("222");
}).then(res=>{console.log(res)}).catch(err=>{console.log(err)});
}
//Promise.all([p1, p2, p3]): 把promise打包,扔到一个数组里面,打包完还是一个promise对象
//必须确保,所有的promise对象,都是resolve状态,都是成功状态
//Promise.race([p1, p2, p3]): 只要有一个成功,就返回
</script>
【第十课:模块化】
*******************************************************************************
<script type="module">
//模块化:
// 注意: 需要放到服务器环境
// a). 如何定义模块?
// export 东西
// export const a =12;
// export{
// a as aaa,
// b as banana
// }
// b). 如何使用?
// import
// import './modules/1.js';
// import {a as a, banana, c} from './modules/2.js'
// import * as modTwo from './modules/2.js';
//使用模块:
// <script type="module"><?script>
//1.js
//console.log("模块1加载")
//export default "默认值";
//export const a = "a的值";
//export const b = "b值";
import dVal, { a as apple, b } from './modules/1.js'; //模块里面是默认值(export default "默认值"; );外部接受时不使用{}。
console.log(dVal, apple, b);
///模块1加载
///默认值 a的值 b值
//import: 特点
// a). import 可以是相对路径,也可以是绝对路径
// import 'https://code.jquery.com/jquery-3.3.1.js';
// b). import模块只会导入一次,无论你引入多少次
// c). import './modules/1.js'; 如果这么用,相当于引入文件
// d). 有提升效果,import会自动提升到顶部,首先执行
// e). 导出去模块内容,如果里面有定时器更改,外面也会改动,不想Common规范缓存
// import() 类似node里面require, 可以动态引入, 默认import语法不能写到if之类里面
// 返回值,是个promise对象
// import('./modules/1.js').then(res=>{
// console.log(res.a+res.b);
// });
//动态引入
import('./modules/1.js').then(res => {
console.log(res.default + res.a + res.b);
});
//默认值a的值b值
// 优点:
// 1. 按需加载
// 2. 可以写if中
// 3. 路径也可以动态
// Promise.all([])
</script>
【第十一课:类和继承】
*******************************************************************************
*******************************************************************************
<script type="module">
let aaa = "test"; //定义变量作为方法名
let bbb = "t111";
class Person {
constructor(name, age) {
console.log(`传入参数name${name};age${age};`);
this.name = name;
this.age = age;
}
showName() {
console.log(this.name);
}
showAge() {
console.log(this.age);
}
//方法名拼接
[aaa]() { // 调用方法名变量
console.log("test");
}
[bbb]() { // 调用方法名变量
console.log("t111");
}
[aaa + bbb]() { // 调用方法名变量
console.log("testt111");
}
//静态方法
static sfn() {
console.log("调用静态函数sfn");
}
}
class Student extends Person {
constructor(name, age, skill) {
super(name, age);
this.skill = skill;
}
showName() {
super.showName();
console.log("子类");
}
showSkill() {
console.log(this.skill);
}
}
let person = new Person("张三", 18);
//传入参数name张三;age18;
console.log(person.name);
// 张三
console.log(person.age);
//18
person.showName();
//张三
person.showAge();
///////////////////////////////////方法名拼接
//18
person.test();
//test
person[aaa]();
//test
person.t111();
//t111
person[bbb]();
//t111
person.testt111();
//testt111
person[aaa + bbb]();
//testt111
Person.sfn();
//调用静态函数sfn
let stu = new Student("学生张", 18, "逃学");
stu.showName();
//传入参数name学生张; age18;
//学生张
//子类
</script>
【第十二课:Symbol&generator】
*******************************************************************************
*******************************************************************************
Symbol
<script>
//数据类型:number、string、boolean、Object、undefined、function、symbol(ES6新增数据类型)
// symbol 使用情况一般
//
//定义:
// let syml = Symbol('aaa');
//
//注意:
// 1. Symbol 不能new
// 2. Symbol() 返回是一个唯一值
// 坊间传说, 做一个key,定义一些唯一或者私有一些东
// 3. symbol是一个单独数据类型,就叫 symbol, 基本类型
//
// 4. 如果symbol作为key,用for in循环,出不来
let syml = Symbol('aaa');
console.log(syml);
//Symbol(aaa)
</script>
Generator
<script>
//generator 解决异步深度嵌套的问题, async
//定义:
function* gen() {
yield 'welcome';
yield 'to';
return '牧码人';
}
//调用:
let g1 = gen();
g1.next(); // {value:'welcome', done:false}
//console.log(g1.next());
g1.next(); // {value:'to', done:false}
g1.next(); // {value:'牧码人', done:true}
// for .. of 自动遍历 generator
// return的东西,它不会遍历
</script>
异步: 不连续,上一个操作没有执行完,下一个操作照样开始
同步: 连续执行,上一个操作没有执行完,下一个没法开始
关于异步,解决方案:
a). 回调函数
b). 事件监听
c). 发布/订阅
d). Promise对象
e).generator,
【第十三课:async,await】
*******************************************************************************
*******************************************************************************
<script>
//ES2017,规定 async
//nodeJs
//读取文件 fs.readFile
//1. promise
//2. genrator
//3. async
const fn = function (status) {
return new Promise(function (resolve, reject) {
if (status % 2 == 1) {
resolve(status);
} else {
throw new Error("出错了")
}
}).then(res => { console.log(res) }).catch(err => { console.log(err) });
}
//async function fn(){ //表示异步,这个函数里面有异步任务
//let result = await xxx //表示后面结果需要等待
//}
async function test() {
let t1 = await fn(1);
let t2 = await fn(2);
let t3 = await fn(3);
}
test();
//async特点:
// 1. await只能放到async函数中
// 2. 相比genrator语义化更强
// 3. await后面可以是promise对象,也可以数字、字符串、布尔
// 4. async函数返回是一个promise对象
// 5. 只要await语句后面Promise状态变成 reject, 那么整个async函数会中断执行
//如何解决async函数中抛出错误,影响后续代码:
// a).
// try{
//
// }catch(e){
//
// }
// b). promise本身catch
//个人建议大家:
// try{
// let f1 = await readFile('data/a.txt');
// let f3 = await readFile('data/c.txt');
// let f2 = await readFile('data/b.txt');
// }catch(e){}
</script>
【第十四课:Set和WeakSet】
*******************************************************************************
*******************************************************************************
Set
<script>
//数据结构
//数组
//json, 二叉树....
//
//set数据结构:
//类似数组,但是里面不能有重复值
//let setArr = new Set("a", "c", "a", "b");
let setArr = new Set();
setArr.add("a").add("c").add("a").add("b");
console.log(setArr);
setArr.delete("a");
console.log(setArr);
let isHas = setArr.has("a");
console.log(isHas);
console.log(setArr.size);
setArr.forEach((val, index) => {
console.log(val, index);
});
setArr.clear();
</script>
WeakSet
new Set([]); 存储数组, 这种写法对
new WeakSet({}) 存储json,这种写法不靠谱
WeakSet没有size,也没有clear()
有, add(), has(), delete()
确认,初始往里面添加东西,是不行的。最好用add添加
【第十五课:Map和WeakMap】
*******************************************************************************
*******************************************************************************
map:
类似 json, 但是json的键(key)只能是字符串
map的key可以是任意类型
使用:
let map = new Map();
map.set(key,value); 设置一个值
map.get(key) 获取一个值
map.delete(key) 删除一项
map.has(key) 判断有没有
map.clear() 清空
循环:
for(let [key,value] of map){}
for(let key of map.keys()){}
for(let value of map.values()){}
for(let [k,v] of map.entries()){}
map.forEach((value, key) =>{
console.log(value, key);
})
WeakMap(): key只能是对象
Set 里面是数组,不重复,没有key,没有get方法
Map 对json功能增强,key可以是任意类型值
【第十六课:数字的变化及Math新增对象】
*******************************************************************************
*******************************************************************************
数字(数值)变化:
二进制: (Binary)
let a = 0b010101;
八进制: (Octal)
let a = 0o666;
十六进制:
#ccc
Nunber()、parseInt()、 parseFloat()
Number.isNaN(NaN) -> true
Number.isFinite(a) 判断是不是数字
Number.isInteger(a) 判断数字是不是整数
Number.parseInt();
Number.parseFloat();
安全整数:
2**3
安全整数: -(2^53-1) 到 (2^53-1), 包含-(2^53-1) 和(2^53-1)
Number.isSafeInteger(a);
Number.MAX_SAFE_INTEGER 最大安全整数
Number.MIN_SAFE_INTEGER 最小安全整数
Math:
Math.abs()
Math.sqrt()
Math.sin()
Math.trunc() 截取,只保留整数部分
Math.trunc(4.5) -> 4
Math.trunc(4.9) -> 4
Math.sign(-5) 判断一个数到底是正数、负数、0
Math.sign(-5) -> -1
Math.sign(5) -> 1
Math.sign(0) -> 0
Math.sign(-0) -> -0
其他值,返回 NaN
Math.cbrt() 计算一个数立方根
Math.cbrt(27) -> 3
【第十七课:ES2018新增对象】
*******************************************************************************
*******************************************************************************
ES2018(ES9):
1. 命名捕获
语法: (?<名字>)
let str = '2018-03-20';
let reg = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/;
let {year, month ,day} = str.match(reg).groups;
console.log(year, month, day);
反向引用:
\1 \2 $1 $2
反向引用命名捕获:
语法: \k<名字>
let reg = /^(?<Strive>welcome)-\k<Strive>$/;
匹配: ‘welcome-welcome’
let reg = /^(?<Strive>welcome)-\k<Strive>-\1$/;
匹配: 'welcome-welcome-welcome'
替换:
$<名字>
let reg = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/;
str = str.replace(reg,'$<day>/$<month>/$<year>');
console.log(str);
str = str.replace(reg, (...args)=>{
//console.log(args)
let {year, month, day} = args[args.length-1];
return `${day}/${month}/${year}`;
});
console.log(str);
2. dotAll 模式 s
之前 '.' 在正则里表示匹配任意东西, 但是不包括 \n
let reg = /\w+/gims;
3. 标签函数
function fn(){
}
fn() //这样调用就是普通函数
fn`aaa` //标签函数使用
function fn(args){
return args[0].toUpperCase();
}
console.log(fn`welcome`);
【第十八课:Proxy的使用】
*******************************************************************************
*******************************************************************************
<script>
let obj = {
name: "name1",
age: 18
};
let newObj = new Proxy(obj, {
get(target, property) {
console.log(target, property);
if (property == "age") {
console.log(`您访问了${property}属性。禁止访问年龄属性`);
return undefined;
} else {
console.log(`您访问了${property}属性。`);
return target[property];
}
}
})
console.log(newObj.name);
console.log(newObj.age);
//语法:
// new Proxy(target, handler);
// let obj = new Proxy(被代理的对象,对代理的对象做什么操作)
//
// handler:
//
// {
// set(){}, //设置的时候干的事情 设置,拦截:设置一个年龄,保证是整数,且范围不能超过200
// get(){}, //获取干的事情 获取拦截
// deleteProperty(){}, //删除 删除,拦截:
// has(){} //问你有没有这个东西 ‘xxx’ in obj 检测有没有
// apply() //调用函数处理 拦截方法
// .....
// }
//
//实现一个,访问一个对象身上属性,默认不存在的时候给了undefined,希望如果不存在错误(警告)信息:
</script>
【第十九课:Reflect的使用】
*******************************************************************************
*******************************************************************************
Reflect.apply(调用的函数,this指向,参数数组);
fn.call()
fn.apply() 类似
Reflect: 反射
Object.xxx 语言内部方法
Object.defineProperty
放到Reflect对象身上
通过Reflect对象身上直接拿到语言内部东西
'assign' in Object -> Reflect.has(Object, 'assign')
delete json.a -> Reflect.deleteProperty(json, 'a');
<script>
function sum(a, b) {
return a + b;
}
let newSum = new Proxy(sum, {
apply(target, context, args) {
return Reflect.apply(...arguments) ** 2;
}
});
console.log(newSum(2,3));
console.log(Reflect.apply(sum,"aaa",[2,3]));
let json = {
a:1,
b:2
};
Reflect.deleteProperty(json, 'a');
console.log(json);
</script>
来源:https://www.cnblogs.com/obchy/p/11149358.html