03 2020 档案
摘要：类相当于实例的原型，所有在类中定义的方法，都会被实例继承。如果在一个方法前，加上static关键字，就表示该方法不会被实例继承，而是直接通过类来调用，这就称为“静态方法”。 class Foo { static classMethod() { return 'hello'; } } Foo.clas
阅读全文
摘要：严格模式 类和模块的内部，默认就是严格模式，所以不需要使用use strict指定运行模式。只要你的代码写在类或模块之中，就只有严格模式可用。考虑到未来所有的代码，其实都是运行在模块之中，所以 ES6 实际上把整个语言升级到了严格模式 不存在提升 类不存在变量提升（hoist），这一点与 ES5 完
阅读全文
摘要：类的属性名，可以采用表达式。 let methodName = 'getArea'; class Square { constructor(length) { // ... } [methodName]() { // ... } } 上面代码中，Square类的方法名getArea，是从表达式得到的
阅读全文
摘要：与 ES5 一样，在“类”的内部可以使用get和set关键字，对某个属性设置存值函数和取值函数，拦截该属性的存取行为。 class MyClass { constructor() { // ... } get prop() { return 'getter'; } set prop(value) {
阅读全文
摘要：生成类的实例的写法，与 ES5 完全一样，也是使用new命令。如果忘记加上new，像函数那样调用Class，将会报错。 class Point { // ... } // 报错 var point = Point(2, 3); // 正确 var point = new Point(2, 3); 与
阅读全文
摘要：constructor方法是类的默认方法，通过new命令生成对象实例时，自动调用该方法。一个类必须有constructor方法，如果没有显式定义，一个空的constructor方法会被默认添加。 class Point { } // 等同于 class Point { constructor() {
阅读全文
摘要：class关键字，可以定义类 function Point(x, y) { this.x = x; this.y = y; } Point.prototype.toString = function () { return '(' + this.x + ', ' + this.y + ')'; };
阅读全文
摘要：由于 Generator 函数返回的遍历器对象，只有调用next方法才会遍历下一个内部状态，所以其实提供了一种可以暂停执行的函数。yield表达式就是暂停标志。 function* gen() { yield 123 + 456; } 上面代码中，yield后面的表达式123 + 456，不会立即求
阅读全文
摘要：Generator 函数是 ES6 提供的一种异步编程解决方案，语法行为与传统函数完全不同 Generator 函数是一个普通函数，但是有两个特征。一是，function关键字与函数名之间有一个星号；二是，函数体内部使用yield表达式，定义不同的内部状态（yield在英语里的意思就是“产出”） f
阅读全文
摘要：一个数据结构只要部署了Symbol.iterator属性，就被视为具有 iterator 接口，就可以用for...of循环遍历它的成员。也就是说，for...of循环内部调用的是数据结构的Symbol.iterator方法。 for...of循环可以使用的范围包括数组、Set 和 Map 结构、某
阅读全文
摘要：遍历器（Iterator）它是一种接口，为各种不同的数据结构提供统一的访问机制。 任何数据结构只要部署 Iterator 接口，就可以完成遍历操作 Iterator 的作用 一是为各种数据结构，提供一个统一的、简便的访问接口；二是使得数据结构的成员能够按某种次序排列；三是 ES6 创造了一种新的遍历
阅读全文
摘要：finally() finally方法用于指定不管 Promise 对象最后状态如何，都会执行的操作 promise .then(result => {···}) .catch(error => {···}) .finally(() => {···}); all() Promise.all()方法用
阅读全文
摘要：Promise.prototype.catch方法是.then(null, rejection)或.then(undefined, rejection)的别名，用于指定发生错误时的回调函数。 getJSON('/posts.json').then(function(posts) { // ... }
阅读全文
摘要：Promise 实例具有then方法，也就是说，then方法是定义在原型对象Promise.prototype上的。 then方法的第一个参数是resolved状态的回调函数， 第二个参数（可选）是rejected状态的回调函数。 then链式写法 getJSON("/posts.json").th
阅读全文
摘要：所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法上说，Promise 是一个对象，从它可以获取异步操作的消息。Promise 提供统一的 API，各种异步操作都可以用同样的方法进行处理。 对象的状态不受外界影响。Promise对象代表一个异
阅读全文
摘要：Reflect 是一个内置的对象，它提供拦截 JavaScript 操作的方法。这些方法与proxy handlers的方法相同。Reflect不是一个函数对象，因此它是不可构造的 与大多数全局对象不同，Reflect不是一个构造函数。你不能将其与一个new运算符一起使用，或者将Reflect对象作
阅读全文
摘要：在 Proxy 代理的情况下，目标对象内部的this关键字会指向 Proxy 代理。 const target = { m: function () { console.log(this proxy); } }; const handler = {}; const proxy = new Proxy
阅读全文
摘要：Proxy 用于修改某些操作的默认行为，等同于在语言层面做出修改 Proxy 可以理解成，在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界的访问进行过滤和改写。Proxy 这个词的原意是代理，用在这里表示由它来“代理”某些操作，可以译为“代理器
阅读全文
摘要：WeakMap结构与Map结构类似，用于生成键值对的集合。 // WeakMap 可以使用 set 方法添加成员 const wm1 = new WeakMap(); const key = {foo: 1}; wm1.set(key, 2); wm1.get(key) // 2 // WeakMa
阅读全文
摘要：Map 转为数组 const myMap = new Map() .set(true, 7) .set({foo: 3}, ['abc']); [...myMap] // 使用扩展运算符（...） // [ [ true, 7 ], [ { foo: 3 }, [ 'abc' ] ] ] 数组 转为
阅读全文
摘要：Map 结构转为数组结构，比较快速的方法是使用扩展运算符（...） const map = new Map([ [1, 'one'], [2, 'two'], [3, 'three'], ]); [...map.keys()] // [1, 2, 3] [...map.values()] // ['
阅读全文
摘要：Map.prototype.keys() const map = new Map([ ['F', 'no'], ['T', 'yes'], ]); for (let key of map.keys()) { // 返回键名的遍历器 console.log(key); } // "F" // "T"
阅读全文
摘要：size 属性 const map = new Map(); map.set('foo', true); map.set('bar', false); map.size // 2 size属性返回 Map 结构的成员总数 Map.prototype.set(key, value) var myMap
阅读全文
摘要：Map 数据结构。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。也就是说，Object 结构提供了“字符串—值”的对应，Map 结构提供了“值—值”的对应，是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构，Map 比 Objec
阅读全文
摘要：和 Set 对象的区别有两点: 与Set相比，WeakSet 只能是对象的集合，而不能是任何类型的任意值。 WeakSet持弱引用：集合中对象的引用为弱引用。 如果没有其他的对WeakSet中对象的引用，那么这些对象会被当成垃圾回收掉。 这也意味着WeakSet中没有存储当前对象的列表。 正因为这样
阅读全文
摘要：类似于数组，但是成员的值都是唯一的，没有重复的值 const s = new Set(); [2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x)); for (let i of s) { console.log(i); } // 2 3 5 4 Set函数可以接受一
阅读全文
摘要：instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。 function Car(make, model, year) { this.make = make; this.model = model; this.year = year; } cons
阅读全文
摘要：前六种是：undefined、null、布尔值（Boolean）、字符串（String）、数值（Number）、对象（Object）。 symbol生成 let s = Symbol(); typeof s // "symbol" Symbol函数可以接受一个字符串作为参数 let s1 = Sym
阅读全文
摘要：Object.entries()方法返回一个给定对象自身可枚举属性的键值对数组，其排列与使用 for...in 循环遍历该对象时返回的顺序一致（区别在于 for-in 循环还会枚举原型链中的属性）。 const obj = { foo: 'bar', baz: 42 }; console.log(O
阅读全文
摘要：将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。 第一个参数是目标对象，后面的参数都是源对象。 合并对象 const o1 = { a: 1 }; const o2 = { b: 2 }; const o3 = { c: 3 }; const obj = Object.ass
阅读全文
摘要：比较两个值是否严格相等 相等运算符（==）会自动转换数据类型 严格相等运算符（ ）NaN不等于自身，以及+0等于-0 +0 -0 //true NaN NaN // false Object.is(+0, -0) // false Object.is(NaN, NaN) // true Object
阅读全文
摘要：新的 Null 判断运算符?? 它的行为类似|| ？？ 只有运算符左侧的值为null或undefined时，才会返回右侧的值 || es5除了 null或undefined ，空字符串或false或0，都会返回右侧的值 const headerText = response.settings.hea
阅读全文
摘要：function doSomething(onContent, onError) { try { // ... do something with the data } catch (err) { if (onError) { // 校验onError是否真的存在 onError(err.messa
阅读全文
摘要：let z = { a: 3, b: 4 }; let n = { ...z }; n // { a: 3, b: 4 } // 等同于 {...Object(true)} {...true} // {} // 等同于 {...Object(undefined)} {...undefined} //
阅读全文
摘要：Object.getOwnPropertyDescriptor() 方法返回指定对象上一个自有属性对应的属性描述符。 let obj = { foo: 123 }; Object.getOwnPropertyDescriptor(obj, 'foo') // { // value: 123, //
阅读全文
摘要：定义对象的属性 // 方法一 obj.foo = true; // 方法二 obj['a' + 'bc'] = 123; var obj = { foo: true, abc: 123 }; ES6 允许字面量定义对象时，用方法二（表达式）作为对象的属性名，即把表达式放在方括号内。 let prop
阅读全文
摘要：function f(x, y) { return {x, y}; } // 等同于 function f(x, y) { return {x: x, y: y}; } f(1, 2) // Object {x: 1, y: 2} const o = { method() { return "Hel
阅读全文
摘要：数组的空位指，数组的某一个位置没有任何值。 比如，Array构造函数返回的数组都是空位。 空位不是undefined，一个位置的值等于undefined，依然是有值的。空位是没有任何值 Array(3) // [, , ,] Array.from(['a',,'b']) // [ "a", unde
阅读全文
摘要：Array.prototype.flat() 用于将嵌套的数组“拉平”，变成一维的数组。 该方法返回一个新数组，对原数据没有影响。 var arr1 = [1, 2, [3, 4]]; arr1.flat(); // [1, 2, 3, 4] var arr2 = [1, 2, [3, 4, [5,
阅读全文
摘要：includes() 方法用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回false。 const array1 = [1, 2, 3]; console.log(array1.includes(2));// expected output: true const
阅读全文
摘要：keys()是对键名的遍历、 values()是对键值的遍历 entries()是对键值对的遍历。 for (let index of ['a', 'b'].keys()) { console.log(index); } // 0 // 1 for (let elem of ['a', 'b'].v
阅读全文
摘要：fill() 方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。 const array1 = [1, 2, 3, 4]; // fill with 0 from position 2 until position 4 console.log(array1.fill(0
阅读全文
摘要：findIndex() 返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1。 const array1 = [5, 12, 8, 130, 44]; const isLargeNumber = (element) => element > 13; console.log(array1.fi
阅读全文
摘要：Array.of(7) 创建一个具有单个元素 7 的数组， Array(7) 创建一个长度为7的空数组（注意：这是指一个有7个空位(empty)的数组，而不是由7个undefined组成的数组）。 Array.of(7); // [7] Array.of(1, 2, 3); // [1, 2, 3]
阅读全文
摘要：slice() 方法返回一个新的数组对象，这一对象是一个由 begin 和 end 决定的原数组的浅拷贝（包括 begin，不包括end）。原始数组不会被改变。 const animals = ['ant', 'bison', 'camel', 'duck', 'elephant']; consol
阅读全文
摘要：let arrayLike = { '0': 'a', '1': 'b', '2': 'c', length: 3 }; // ES5的写法 var arr1 = [].slice.call(arrayLike); console.log(arr1)// ['a', 'b', 'c'] // ES6
阅读全文
摘要：扩展运算符 - push var arr1 = [0, 1, 2]; var arr2 = [3, 4, 5]; let a = Array.prototype.push.apply(arr1, arr2); console.log(a) // 6 console.log(arr1) // [0,
阅读全文
摘要：扩展运算符是三个点（...） console.log(...[1, 2, 3]) // 1 2 3 console.log(1, ...[2, 3, 4], 5) // 1 2 3 4 5 [...document.querySelectorAll('div')] // [<div>, <div>,
阅读全文
摘要：方法返回一个表示当前函数源代码的字符串。 function sum(a, b) { return a + b; } console.log(sum.toString()); // expected output: "function sum(a, b) { // return a + b; // }
阅读全文
摘要：try { // ... } catch (err) { // 处理错误 } try { // ... } catch { // ... }
阅读全文
摘要：function clownsEverywhere( param1, param2 ) { /* ... */ } clownsEverywhere( 'foo', 'bar' ); function clownsEverywhere( param1, param2, ) { /* ... */ }
阅读全文
摘要：某个函数的最后一步是调用另一个函数 function f(x){ return g(x); }函数f的最后一步是调用函数g，这就叫尾调用。 以下三种情况，都不属于尾调用 // 情况一 function f(x){ let y = g(x); return y; } // 情况二 function f
阅读全文
摘要：使用“箭头”（=>）定义函数 var f = v => v; // 等同于 var f = function (v) { return v; }; 需要多个参数，就使用一个圆括号代表参数部分 var f = () => 5; // 等同于 var f = function () { return 5
阅读全文
摘要：ES5 的name属性，会返回空字符串，而 ES6 的name属性会返回实际的函数名。 var f = function () {}; // 匿名函数 // ES5 f.name // "" // ES6 f.name // "f" const bar = function baz() {}; //
阅读全文
摘要：形式为...变量名 一个不定数量的参数表示为一个数组 function sum(...theArgs) { return theArgs.reduce((previous, current) => { return previous + current; }); } console.log(sum(
阅读全文
摘要：函数指定了默认值以后，函数的length属性，将返回没有指定默认值的参数个数。 (function (a) {}).length // 1 (function (a = 5) {}).length // 0 (function (a, b, c = 5) {}).length // 2 定义了 3
阅读全文
摘要：function log(x, y = 'World') { console.log(x, y); } log('Hello') // Hello World log('Hello', 'China') // Hello China log('Hello', '') // Hello 参数变量是默认
阅读全文
摘要：let a = 2 ** 2 let b = 2 ** 3 console.log(a) // 4 console.log(b) // 8 a **= 2; // 等同于 a = a * a; b **= 3; // 等同于 b = b * b * b;
阅读全文
摘要：返回一个数字的符号, 指示数字是正数，负数还是零。 此函数共有5种返回值, 分别是 1, -1, 0, -0, NaN. 代表的各是正数, 负数, 正零, 负零, NaN。 传入该函数的参数会被隐式转换成数字类型。 Math.sign(3); // 1 Math.sign(-3); // -1 Ma
阅读全文
摘要：将数字的小数部分去掉，只保留整数部分。 仅仅是删除掉数字的小数部分和小数点，不管参数是正数还是负数。 传入该方法的参数会被隐式转换成数字类型。 Math.trunc(4.1) // 4 Math.trunc(4.9) // 4 Math.trunc(-4.1) // -4 Math.trunc(-4
阅读全文
摘要：用来判断一个数值是否为整数 console.log(Number.isInteger()) // false console.log(Number.isInteger(null)) // false console.log(Number.isInteger('15')) // false conso
阅读全文
摘要：Number.isFinite() 用来检查一个数值是否为有限的（finite），是否是一个有穷数（finite number），即不是Infinity 如果参数类型不是数值，Number.isFinite一律返回false Number.isFinite(NaN); // false Number
阅读全文
摘要：trimStart()消除字符串头部的空格，trimEnd()消除尾部的空格 const s = ' abc '; let a = s.trim() let b = s.trimStart() let c = s.trimEnd() console.log(a)// "abc" console.lo
阅读全文
摘要：如果某个字符串不够指定长度，会在头部或尾部补全。padStart()用于头部补全，padEnd()用于尾部补全。 'abc'.padEnd(10); // "abc " 'abc'.padEnd(10, "foo"); // "abcfoofoof" 'abc'.padEnd(6, "123456"
阅读全文
摘要：repeat方法返回一个新字符串，表示将原字符串重复n次。 "abc".repeat(-1) // RangeError: repeat count must be positive and less than inifinity "abc".repeat(0) // "" "abc".repeat
阅读全文
摘要：endsWith()：返回布尔值，表示参数字符串是否在原字符串的尾部。 str.endsWith(searchString[, length]) 参数 searchString要搜索的子字符串。length可选。作为 str 的长度。默认值为 str.length。 var str = "To be
阅读全文
摘要：startsWith() 方法用来判断当前字符串是否以另外一个给定的子字符串开头，并根据判断结果返回 true 或 false。 str.startsWith(searchString[, position])searchString：要搜索的子字符串。position： 可选在 str 中搜索 s
阅读全文
摘要：includes() 方法用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回false。 const array1 = [1, 2, 3]; console.log(array1.includes(2)); // true console.log(array1.inc
阅读全文
摘要：String.raw() 是一个模板字符串的标签函数 该方法返回一个斜杠都被转义（即斜杠前面再加一个斜杠）的字符串，往往用于模板字符串的处理方法 let a = String.raw`Hi\n${2+3}!` console.log(a) // Hi\n5! let b = `Hi\n${2+3}!
阅读全文
摘要：标签模板不是模板，而是函数调用的一种特殊形式 alert`hello` // 等同于 alert(['hello'])
阅读全文
摘要：<div id="abc"></div> <script> // es5 var dd = 'abc' $('#abc').append( 'There are <b>' + dd + '</b> ' + '你是我的' ); // es6 $('#abc').append(` There are <
阅读全文
摘要：遍历数组 const array1 = ['a', 'b', 'c']; for (const element of array1) { console.log(element); // a // b // c } 遍历字符串 const str = 'abc'; for (const elemen
阅读全文
摘要：function move({ x, y } = { x: 0, y: 0 }) { return [x, y]; } console.log(move({ x: 3, y: 8 })); // [3, 8] console.log(move({ x: 3 })); // [3, undefined
阅读全文
摘要：let {toString: s} = 123; console.log(s) // ƒ toString() { [native code] } 如果等号右边是数值和布尔值，则会先转为对象。 let {toString: s} = false; console.log(s) // ƒ toStri
阅读全文
摘要：const [a, b] = 'he'; console.log(a) // h console.log(b) // e
阅读全文
摘要：数组的元素是按次序排列的，变量的取值由它的位置决定； 而对象的属性没有次序，变量必须与属性同名，才能取到正确的值。 let { baz } = { foo: 'aaa', bar: 'bbb' }; console.log(baz) // undefined let obj = { first: '
阅读全文
摘要：let [foo, [[bar], baz]] = [1, [[2], 3]]; console.log(foo) // 1 console.log(bar) // 2 console.log(baz) // 3 let [a, ...b] = [1, 2, 3, 4]; console.log(a
阅读全文
摘要：从一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例。 从 String 生成数组 let a = Array.from('foo'); console.log(a) // [ "f", "o", "o" ] 从 Set 生成数组 const set = new Set(['foo', 'bar
阅读全文
摘要：set 对象 用来存储任何类型的唯一值 new Set() ，用来去重数组。 let arr = [1, 1, 2, 2, 3,3]; let arr2 = new Set(arr); let arr3 = Array.from(arr2); console.log(arr3); // [1, 2,
阅读全文
摘要：顶层对象 es5：window对象， node：global对象 var a = 1; // 全局变量 window.a // 1 全局变量的赋值等同于顶层对象的赋值，（window对象） let b = 1; //全局变量window.b // undefined let命令、const命令声明的
阅读全文
摘要：Object.freeze() 冻结一个对象，对对象增删改都不可以 const obj = { prop: 42 }; Object.freeze(obj); obj.prop = 33; console.log(obj.prop);// 42 const obj = { prop: 42 }; o
阅读全文
摘要：const声明常量，只读、值不能改变。 const PI = 3.1415; PI = 3; // Uncaught TypeError: Assignment to constant variable. 声明必须赋值 const PI //Uncaught SyntaxError: Missing
阅读全文
摘要：块级作用域必须有大括号 if (true) let x = 1; // 报错 if (true) { let x = 1; } if (true) var x = 1; // 正常 if (true) { var x = 1; } 块级作用域内声明的函数，对作用域之外没有影响 function f(
阅读全文
摘要：Javascript的函数表达式： var a= function(){ } 函数表达式没有提升 a(); // Uncaught TypeError: a is not a function var a = function () { console.log('bar'); }; 函数声明： fu
阅读全文
浙公网安备 33010602011771号