let,const

  • let声明变量,const声明常量,两者均为块级作用域
  • let,const在块级作用域内不允许重复声明
  • const声明的基本数据类型不可以修改,引用数据类型可以修改。具体看我的另一篇文章
  • let不会存在变量提升,var会存在变量提升
console.log(a);
var a=1;
// undefined
console.log(b);
let b=1;
// 会报错 // 这是应为var声明会提升,实际上var a是在console前的,所以会undefined,而let会直接报错

解构赋值

  • 对应赋值
let {a, b} = {a:1, b:2};  // a => 1 , b => 2
// 交换赋值
let [a,b] = [b,a];
// 提取json数据
let json = {
name : 'leo',
age: 18
}
let {name, age} = json;
console.log(name,age); // leo, 18
// 遍历Map结构
const m = new Map();
m.set('a',1);
m.set('b',2);
for (let [k, v] of m){
console.log(k + ' : ' + v);
}
// 用于按需加载模块中需要用到的方法。
const {log, sin, cos} = require('math');

字符串拓展

  • includes('str’,index):返回布尔值,表示是否找到参数字符串。
  • startsWith('str’,index):返回布尔值,表示参数字符串是否在原字符串的头部。
  • endsWith('str’,index):返回布尔值,表示参数字符串是否在原字符串的尾部。
  • repeat(number):表示重复几遍

模板字符串

  • 在模板字符串中用${}包裹变量
let a = `abc${v1}def`

字符串的正则方法

  • match()、replace()、search()和split()

数值

  • Number.isFinite(), Number.isNaN()
  • Number.parseInt(), Number.parseFloat()
  • Number.isInteger()
  • Math.trunc:用来去除小数的小数部分,返回整数部分;若参数为非数值,则先转为数值;若参数为空值或无法截取整数的值,则返回NaN。
  • Math.sign(): 判断一个数是正数、负数还是零,对于非数值,会先转成数值。
  • Math.cbrt():用来计算一个数的立方根,若参数为非数值则先转成数值。
  • Math.clz32():用于返回一个数的 32 位无符号整数形式有多少个前导 0。
  • Math.imul(): 用于返回两个数以 32 位带符号整数形式相乘的结果,返回的也是一个 32 位的带符号整数。
  • Math.fround():用来返回一个数的2位单精度浮点数形式。
  • Math.hypot():用来返回所有参数的平方和的平方根
  • Math.expm1(): 用来返回ex - 1,即Math.exp(x) - 1。
  • Math.log1p(): 用来返回1 + x的自然对数,即Math.log(1 + x)。如果x小于-1,返回NaN。
  • Math.log10(): 用来返回以 10为底的x的对数。如果x小于 0,则返回 NaN。
  • Math.log2(): 用来返回以 2 为底的x的对数。如果x小于0,则返回 NaN。

函数

  • 参数添加默认值
function f(a, b='leo'){
console.log(a, b);
} f('hi'); // hi leo
f('hi', 'jack'); // hi jack
f('hi', ''); // hi leo

箭头函数

  • this指向定义时的对象本身(可深研究下)
  • 不存在arguments对象,即不能使用,可以使用rest参数代替
  • 不能使用yield命令,即不能用作Generator函数
  • 不能当做构造函数,即不能用new命令,否则报错
()=>{}

数组

  • ...拓展符:一个连接数组的作用;可以实现深拷贝
let a = [1, 2, 3];
let b = [4, 5, 6];
console.log([...a, ...b]);//[1,2,3,4,5,6]
  • Array.from():将 类数组对象 和 可遍历的对象,转换成真正的数组。用法
  • Array.of():将一组数值,转换成数组,弥补Array方法参数不同导致的差异。(Array.of(1,2,3); // [1,2,3])
  • find()和findIndex()
  • fill():用于用指定值填充一个数组,通常用来初始化空数组,并抹去数组中已有的元素。
  • includes():表示数组是否包含给定的值,与字符串的includes方法类似。indexOf返回-1,includes返回true或false
  • entries(),keys(),values(), flat(),flatMap()

对象

  • 简洁表示
let a = 'a1';
let b = { a }; // b => { a : 'a1' }
// 等同于
let b = { a : a };
  • Object.is():用于比较两个对象是否相等,'' 或者 '='会将值自动转化为数值,object.is()弥补这个缺憾
Object.is('a','a');   // true
Object.is({}, {}); // false
  • Object.assign():对象的合并,类似数组的连接,同属性名后者会覆盖前者,浅拷贝

Symbol

  • 新的原始数据类型,表示独一无二的值,主要是为了防止属性名冲突。
  • JavaScript一共有其中数据类型:Symbol、undefined、null、Boolean、String、Number、Object。
  • 作为新类型,有很多用法,此处省略,自行探讨。
// 没有参数
let a1 = Symbol();
let a2 = Symbol();
a1 === a2; // false // 有参数
let a1 = Symbol('abc');
let a2 = Symbol('abc');
a1 === a2; // false

数组set用法

  • 数据结构类似数组,所有成员数值唯一
// add方法来添加新成员。
let a = new Set();
[1,2,2,1,3,4,5,4,5].forEach(x=>a.add(x));
for(let k of a){
console.log(k)
}; // 基础使用
let a = new Set([1,2,3,3,4]);
[...a]; // [1,2,3,4]
a.size; // 4 // 数组去重
[...new Set([1,2,3,4,4,4])];// [1,2,3,4] //增删改查
let a = new Set();
a.add(1).add(2); // a => Set(2) {1, 2}
a.has(2); // true
a.has(3); // false
a.delete(2); // true a => Set(1) {1}
a.clear(); // a => Set(0) {} // 数据类型不会转换
[...new Set([5,'5'])]; // [5, "5"] // 遍历和过滤
let a = new Set([1,2,3,4]); // map 遍历操作
let b = new Set([...a].map(x =>x*2));// b => Set(4) {2,4,6,8} // filter 过滤操作
let c = new Set([...a].filter(x =>(x%2) == 0)); // b => Set(2) {2,4} // 获取交集 并集 差集
let a = new Set([1,2,3]);
let b = new Set([4,3,2]); // 并集
let c1 = new Set([...a, ...b]); // Set {1,2,3,4} // 交集
let c2 = new Set([...a].filter(x => b.has(x))); // set {2,3} // 差集
let c3 = new Set([...a].filter(x => !b.has(x))); // set {1}

map方法

  • 由于传统的JavaScript对象只能用字符串当做键,给开发带来很大限制,ES6增加Map数据结构,使得各种类型的值(包括对象)都可以作为键。Map结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。
  • 基础使用
let a = new Map();
let b = {name: 'leo' };
a.set(b,'my name'); // 添加值
a.get(b); // 获取值
a.size; // 获取总数
a.has(b); // 查询是否存在
a.delete(b); // 删除一个值
a.clear(); // 清空所有成员 无返回
  • map转数组
let a = new Map([
['name','leo'],
['age',18]
]) let a1 = [...a.keys()]; // a1 => ["name", "age"]
let a2 = [...a.values()]; // a2 =>  ["leo", 18]
let a3 = [...a.entries()];// a3 => [['name','leo'], ['age',18]]
  • 数组转map
let a = [ ['name','leo'], [1, 'hi' ]]
let b = new Map(a);
  • map转对象
function fun(s) {
let obj = Object.create(null);
for (let [k,v] of s) {
obj[k] = v;
}
return obj;
} const a = new Map().set('yes', true).set('no', false);
fun(a)
  • 对象转map
function fun(obj) {
let a = new Map();
for (let k of Object.keys(obj)) {
a.set(k, obj[k]);
}
return a;
} fun({yes: true, no: false})
  • Map 转 JSON
// Map键名都是字符串,转为对象JSON:
function fun (s) {
let obj = Object.create(null);
for (let [k,v] of s) {
obj[k] = v;
}
return JSON.stringify(obj)
}
let a = new Map().set('yes', true).set('no', false);
fun(a);// '{"yes":true,"no":false}' // Map键名有非字符串,转为数组JSON:
function fun (map) {
return JSON.stringify([...map]);
} let a = new Map().set(true, 7).set({foo: 3}, ['abc']);
fun(a)
// '[[true,7],[{"foo":3},["abc"]]]'
  • JSON 转 Map
// 所有键名都是字符串:
function fun (s) {
let strMap = new Map();
for (let k of Object.keys(s)) {
strMap.set(k, s[k]);
}
return strMap;
return JSON.parse(strMap);
}
fun('{"yes": true, "no": false}');// Map {'yes' => true, 'no' => false}
// 整个 JSON 就是一个数组,且每个数组成员本身,又是一个有两个成员的数组:
function fun2(s) {
return new Map(JSON.parse(s));
}
fun2('[[true,7],[{"foo":3},["abc"]]]')
// Map {true => 7, Object {foo: 3} => ['abc']}

Promise对象

  • 解决异步编程带来的回调地狱问题。解决接口一层一层嵌套的问题。
  • 优点:请求成功后任何时间都可以拿到值;事件错过了就无法添加监听
  • 缺点:无法得到进行的状态;错误需要添加失败回调才能获知,内部错误不会反映到外部。
  • 基本用法
let p = new Promise(function (resolve, reject){
if(/*异步操作成功*/){
resolve(value);
} else {
reject(error);
}
})
// resolve作用是将Promise的状态从pending变成resolved,在异步操作成功时调用,返回异步操作的结果,作为参数传递出去。
// reject作用是将Promise的状态从pending变成rejected,在异步操作失败时报错,作为参数传递出去。 // demo
const p1 = new Promise(function(resolve, reject) {
setTimeout(() => resolve(console.log(123)), 3000)
}) const p2 = new Promise(function(resolve, reject) {
setTimeout(() => resolve(p1), 1000)
}) p2
.then(result => console.log(result))
.catch(error => console.log(error))
// 123
// promise接受两个参数resolve,reject,内部函数成功则触发resolve,失败则触发reject const p = new Promise(function(resolve, reject) {
resolve('ok');
throw new Error('test');
});
p
.then(function(value) { console.log(value) }) // ok
.catch(function(error) { console.log(error) }); // 捕获错误
.finally(() => {···}) // 失败成功都会执行 const p = Promise.all([p1, p2, p3]);
const p = Promise.race([p1, p2, p3]);
  • 口语化来讲这个promise就是个ajax请求语法糖,杜绝了一层套一层的写法。
  • promise(resolve,reject){请求数据,成功触发resolve(data),失败触发reject(data)}
  • 用then呢是把上一个获取到的数据当参数传给下一个promise

ES6常用总结(一)的更多相关文章

  1. ES6常用语法

    ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015. 也就是说,ES6就是ES2015. ...

  2. ES6常用新特性

    https://segmentfault.com/a/1190000011976770?share_user=1030000010776722 该文章为转载文章!仅个人喜好收藏文章! 1.前言 前几天 ...

  3. ES6常用特性总览

    以前看过一遍es6,今天面试时被问到了一个很简单的es6特性,竟然没回答上来,特来重温一下es6,做个总结性笔记. 一.什么是es6 es6是新版本JavaScript语言的标准,在2015年6月发布 ...

  4. ES6常用对象操作

    ES6常用对象操作 一. const 简单类型数据常量 // const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址不得改动.对于简单类型的数据(数值.字符串.布尔值),值就保存在 ...

  5. ES6常用语法总结

    ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015.也就是说,ES6就是ES2015.虽 ...

  6. es6常用基础合集

    es6常用基础合集 在实际开发中,ES6已经非常普及了.掌握ES6的知识变成了一种必须.尽管我们在使用时仍然需要经过babel编译. ES6彻底改变了前端的编码风格,可以说对于前端的影响非常巨大.值得 ...

  7. ES6常用语法简介import export

    ES6常用语法简介import export let与var用法区别 //var var a = []; for (var i = 0; i < 10; i++) { a[i] = functi ...

  8. es6常用功能与异步详解(JS高级面试题)

    callback hell方法的使用 可读性不友好 function loadImg(src,callback,fail){ var img = document.createElement('img ...

  9. ES5与ES6常用语法教程之 ②解构语法糖、声明变量异同

    js常用语法系列教程如下 es5与es6常用语法教程(1) es5与es6常用语法教程(2) es5与es6常用语法教程(3) es5与es6常用语法教程(4) es5与es6常用语法教程(5) es ...

  10. vue学习(一)ES6常用语法

    1 ES6常用语法 1.1 变量提升 例① # 变量提升 <div id="app"> </div> <script> console.log( ...

随机推荐

  1. [转] 总结了N个真实线上故障

    以下文章来源于架构师进阶之路 ,作者二马读书 1. JVM频繁FULL GC快速排查 在分享此案例前,先聊聊哪些场景会导致频繁Full GC: 内存泄漏(代码有问题,对象引用没及时释放,导致对象不能及 ...

  2. Android Spinner的简单用法。

    今天学到的是spinner,就是下拉列表,这可不是ExpandListView哈. 闲话不解释.这是控件,所以先上布局:就不上线性布局了,基本上可以总结出,控件都得在布局里写,写之前嵌个布局就行. & ...

  3. Java语言特性

    Java的语言特性: 1.语法相对简单 2.面向对象 3.分布性 4.可移植性 5.安全性 6.健壮性 7.解释性 8.多线程 9.动态性与并发性 Java中的面向对象编程: 面向对象程序设计(Obj ...

  4. IDEA的基本使用技巧

    博主在大学里学习的专业是计算机科学与技术,在大三的时候才开始接触 “加瓦”,学习加瓦首先就需要一个运行环境,因为受到了老师们的影响,我第一个编辑JAVA的软件环境便是Eclipse,在学校里学习和使用 ...

  5. Java进阶知识

    01[Object类.常用API] 主要内容 Object类 Date类 DateFormat类 Calendar类 System类 StringBuilder类 包装类 第一章 Object类 1. ...

  6. 如何有效防止sql注入

    SQL注入攻击是黑客对数据库进行攻击常用的手段之一,随着B/S模式应用开发的发展,使用这种模式编写应用程序的程序员也越来越多.但是由于程序员的水平及经验参差不齐,相当大一部分程序员在编写代码的时候,没 ...

  7. java二进制表示形式与移位操作符

    java二进制表示形式 java中数字的二进制表示形式称为"有符号的二进制补码",下面先介绍原码,反码,补码. 编码 计算方法 原码 用最高位表示符号位,'1'表示负号,'0'表示 ...

  8. C#设计模式之5-单例模式

    单例模式(Singleton Pattern) 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/397 访问. 单例模式属 ...

  9. C#算法设计查找篇之03-插值查找

    插值查找(Interpolation Search) 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/701 访问. 插值 ...

  10. C#LeetCode刷题之#203-删除链表中的节点(Remove Linked List Elements)

    问题 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/3826 访问. 删除链表中等于给定值 val 的所有节点. 输入: ...