外贸购物网站建站,不用下载就可以登录微信,温州网页网站制作,学生制作设计个人网站Author note(题记)#xff1a; ECMAscript is international standard of javascript。 ECMA 是 js的国际标准版语言。 let and const 为什么之前用var现在需要用let#xff0c;const呢#xff1f; 其实就是因为规范作用域的问题。var的作用域无块级 for (var i 0; i …Author note(题记) ECMAscript is international standard of javascript。 ECMA 是 js的国际标准版语言。 let and const 为什么之前用var现在需要用letconst呢 其实就是因为规范作用域的问题。var的作用域无块级 for (var i 0; i 10; i) {console.log(i)}console.log(i)// 10for (let j 0; j 10; j) {console.log(j)}console.log(j) // 报错 我们看这个代码会发现代码块里边使用var外边也能访问而let就不能所以let更加严谨const也一样只不过const是声明常量的词用作不改变的变量内容。
顺便提一下var的变量提升也是鸡肋的存在不太严谨所以let与const的暂时性死区也是解决这个问题的。
解构赋值 功能就是为了方便取值解构解构先了解之前的结构才能解开结构需一样但取值可少取 比如let 【x,y] [1,2,3] let arr [1,2,3]let a arr[0]let b arr[1]let c arr[2]console.log(数据是, a, b, c)
vs
let [a,b,c] [1,2,3]console.log(数据是, a, b, c)
你会发现es6的写法真的很nice
事实上只要某种数据结构具有 Iterator 接口都可以采用数组形式的解构赋值。
使用场景上对象的解构赋值非常常用比如使用Vuex路由第三方模块等等。
字符串扩展
unicode表示法 ES6 加强了对 Unicode 的支持允许采用\uxxxx形式表示一个字符其中xxxx表示字符的 Unicode 码点。 let b \u0061console.log(数据是, b) // a
遍历字符串
for (let a of hep) {console.log(数据是, a)} 模板字符串
提示这个场景用的最多
let name johnlet age 18let sentence my name is name , my age is ageconsole.log(sentence)let esSentence my name is ${name},my age is ${age}console.log(esSentence)
字符串的新增方法
String.fromCodePoint(
String.fromCharCode(0x20BB7)
正则
RegExp 构造函数
第一种情况是参数是字符串这时第二个参数表示正则表达式的修饰符flag
var regex new RegExp(xyz, i);
// 等价于
var regex /xyz/i;
第二种情况是参数是一个正则表示式这时会返回一个原有正则表达式的拷贝。
var regex new RegExp(/xyz/i);
// 等价于
var regex /xyz/i;
数值的扩展
Number.parseInt(), Number.parseFloat()
// ES6的写法
Number.parseInt(12.34) // 12
Number.parseFloat(123.45#) // 123.45
Number.isInteger()
Number.isInteger()用来判断一个数值是否为整数。
Number.isInteger(25) // true
Number.isInteger(25.1) // false
Math对象的扩展
Math.trunc()
Math.trunc方法用于去除一个数的小数部分返回整数部分。
Math.trunc(4.1) // 4
Math.trunc(4.9) // 4
Math.trunc(-4.1) // -4
Math.trunc(-4.9) // -4
Math.trunc(-0.1234) // -0
Math.sign()
Math.sign方法用来判断一个数到底是正数、负数、还是零。对于非数值会先将其转换为数值。
它会返回五种值。
参数为正数返回1参数为负数返回-1参数为 0返回0参数为-0返回-0;其他值返回NaN。
Math.sign(-5) // -1
Math.sign(5) // 1
Math.sign(0) // 0
Math.sign(-0) // -0
Math.sign(NaN) // NaN 函数的扩展
function Point(x, y) {this.x x || 0;this.y y || 0;
}const p new Point();
p // { x: 0, y: 0 }
vs es6
function Point(x 0, y 0) {this.x x;this.y y;
}const p new Point();
p // { x: 0, y: 0 }
当然下边这个更好一些
我们再看下边这个结合解构赋值的例子
function foo({x, y 5}) {console.log(x, y);}foo({}) // undefined 5foo({x: 1}) // 1 5foo({x: 1, y: 2}) // 1 2
也就是当一个参数为复杂数据类型的时候使用更加的方便了
数组的扩展
合并数组es6之前用concat(),以后就let arr2 【...arr1】
Array.from()
let arrayLike {0: a,1: b,2: c,length: 3
};// ES5 的写法
var arr1 [].slice.call(arrayLike); // [a, b, c]// ES6 的写法
let arr2 Array.from(arrayLike); // [a, b, c]
延申[].slice.call()等同于Array.prototype.slice.call()
实例方法entries()keys() 和 values()
ES6 提供三个新的方法——entries()keys()和values()——用于遍历数组。它们都返回一个遍历器对象详见《Iterator》一章可以用for...of循环进行遍历唯一的区别是keys()是对键名的遍历、values()是对键值的遍历entries()是对键值对的遍历。
for (let index of [a, b].keys()) {console.log(index);
}
// 0
// 1for (let elem of [a, b].values()) {console.log(elem);
}
// a
// bfor (let [index, elem] of [a, b].entries()) {console.log(index, elem);
}
// 0 a
// 1 b
我们常常用Object.keys(obj).length来判断对象是否为nullarr.keys().length也可以啊其实想一想直接arr.length就可以啊。
实例方法includes()
Array.prototype.includes方法返回一个布尔值表示某个数组是否包含给定的值与字符串的includes方法类似。ES2016 引入了该方法。 之前经常使用这个去判断数据当中是否有某一个值进行判断。 实例方法flat()flatMap()
数组的成员有时还是数组Array.prototype.flat()用于将嵌套的数组“拉平”变成一维的数组。该方法返回一个新数组对原数据没有影响。
对象的扩展
属性的简洁表示法
提示这个你会见的最多 比如import {name} from ’/name.js‘
const foo bar;
const baz {foo};
baz // {foo: bar}// 等同于
const baz {foo: foo};
Symbol
这个用的场景就是有些对象属性不想对外开发想私有化就用它就对了
let obj {[Symbol(name)]: 一斤代码,age: 18,title: Engineer
}Object.keys(obj) // [age, title]for (let p in obj) {console.log(p) // 分别会输出age 和 title
}Object.getOwnPropertyNames(obj) // [age, title]
Set与Map
Set理解为数学的集合就行Map就是为了解决键的多样化的设置另外就是按顺序迭代占用空间较小。
Proxy 可以理解的是这个比较重要是对代码的再次编程。 var proxy new Proxy({}, {get: function(target, propKey) {return 35;}
});proxy.time // 35
proxy.name // 35
proxy.title // 35
其实在Vue中我们知道数据的双向绑定Vue2使用的definePropty(),Vue3使用的就是Proxy
Promise 对象
这个非常关键之前写过一篇。
promise的使用
async函数
这个也用的特别多其实就是就是返回一个Promise对象
function timeout(ms) {return new Promise((resolve) {setTimeout(resolve, ms);});
}async function asyncPrint(value, ms) {await timeout(ms);console.log(value);
}asyncPrint(hello world, 50); async function f() {return hello world;
}f().then(v console.log(v))
模块化 目前很多项目都是使用的importexport比较常用 结语
工作之余顺便看看之前的知识是一件开心的事每一次看都会有新的体会。
Module 的语法 - ECMAScript 6入门 (ruanyifeng.com)
