u010234868的专栏

【代码】js数组对象的去重。

需求：学校一个年级有很多个班级，每个班级有很多位学生，原始数据是一个数组对象列表，每个对象中包含年级、班级、学生三个属性，想要获取一组：年级=》班级=》学生这样的组合。为了解决JavaScript的对象使用Number或者其他数据类型作为键这个问题，最新的ES6规范引入了新的数据类型。

ES6 提供了 Map 数据结构，即“值—值”的对应，是一种更完善的 Hash 结构实现。

今天在学习快速上手 | DvaJS的时候，在“新建 model models/products.js ”这部分，遇到如下代码：reducers: { 'delete'(state, { payload: id }) { return state.filter(item => item.id !== id); },},这种写法相当于reducers对象中函数的简写，可以还原为：reducers: { delete: function(state, { payload

1.导出单个特性a.js中导出：// 导出一个变量export let name = 'Jack';// 导出一个函数export function numProduct(num1, num2) { return num1 * num2;}// 导出一个类export class Person { constructor(height, width) { this.height = height; this.width = width; } calcA.

a.js中使用export导出flag，sum：let flag = true;function sum(num1, num2) { return num1 + num2}if (flag) { console.log(sum(1, 2));}export { flag, sum}b.js中使用import导入flag，sum：import { flag, sum } from './a.js';console.log(flag);if (flag) {

1. Object.values()方法返回一个给定对象自身的所有可枚举属性值的数组：const obj = { name: 'zs', age: 18};console.log(Object.values(obj)); // [ 'zs', 18 ]2. Object.entries()方法返回一个给定对象自身可枚举属性的键值对数组：const obj = { name: 'zs', age: 18};console.log(Object.entries(obj)

对象的合并：const obj1 = { x: 1, y: 1}const obj2 = { x: 2, z: 2}const obj3 = { z: 3, a: 3}const result = Object.assign(obj2, obj1, obj3);console.log(result === obj2); // trueconsole.log(obj2); // { x: 1, z: 3, y: 1, a: 3 }对象可枚举的自身..

includes() 方法用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回 false：const arr = [1, 2, NaN, false];console.log(arr.indexOf(1)); // 0console.log(arr.indexOf('1')); // -1console.log(arr.indexOf(NaN)); // -1console.log(arr.indexOf(false)); // 3console.l

Generator 函数是一个普通函数，但是有两个特征。一是，function关键字与函数名之间有一个星号；二是，函数体内部使用yield表达式，定义不同的内部状态（yield在英语里的意思就是“产出”）：function * myFun() { console.log(1); yield 1; console.log(2); yield 2; console.log(3); yield 3;}const result = myFun();console.log(resu

使用回调函数实现对外的接口：a.js：const lists = { names: ['zs', 'ls', 'ww'], hobbies: ['sing', 'reading'], work: ['administration'], each: function (callback) { const all = [].concat(this.names, this.hobbies, this.work); for (const item of all) {

1. Array：const arr = [1, 2, 4, 6];for (const item of arr) { console.log(item);}输出：2. Set：const s = new Set([1, 3]);console.log(s);for (const item of s) { console.log(item);}输出：3. Map：const m = new Map();m.set('name', 'Jack'..

Symbol 值通过Symbol函数生成：const s = Symbol();console.log(s); // Symbol()console.log(typeof s); // symbol 表明变量s是 Symbol 数据类型console.log(Symbol() === Symbol()); // falseSymbol数据类型的应用--向对象中添加两个属性值，保证属性名不重复：const obj = {};obj[Symbol()] = 1;obj[Sy..

JavaScript的Object对象本质上是键值对的集合，但是只接收字符串作为键：const obj = {};obj[123] = 1;obj[true] = 2;obj[{ name: 'zs' }] = 3;console.log(obj); // { '123': 1, true: 2, '[object Object]': 3 }console.log(obj['true']); // 2console.log(obj['[object Object]']); /.

ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。const s = new Set();// 通过add()方法向 Set 结构加入成员s.add(0).add(1).add(2).add(3).add(2);// 结果表明 Set 结构不会添加重复的值console.log(s); // Set { 0, 1, 2, 3 }s.forEach((i) => { console.log(i);});for (let i of s) {.

ES6 Class（类）的继承通过extends关键字实现。在子类的方法中通过super关键字调用父类的方法。class Person { constructor(name) { this.name = name; } sayHi() { console.log(`This is ${this.name}`); }}class Student extends Person { constructor(name, number) { super(name.

Class（类）的方法都会被实例继承，但是对于在方法名前面加了static关键字的方法，则不能直接被实例继承，只能通过类来调用，称之为“静态方法”。class Person { constructor(name) { this.name = name; } sayHi() { console.log(`This is ${this.name}`); } static create(name) { return new Person(name); }}

实例化对象的传统方法是构造函数：function Person(name) { this.name = name;}Person.prototype.sayHi = function () { console.log(`This is ${this.name}`);}var person = new Person('Jack');person.sayHi(); // This is JackES6中引入了Class（类）概念，使用class关键字让对象原型的写法更清晰：

Reflect对象的方法与Proxy对象的方法一一对应，只要是Proxy对象的方法，就能在Reflect对象上找到对应的方法。Reflect对象一共有 13 个静态方法，可以理解为统一的对象操作API：Reflect.apply(target, thisArg, args)Reflect.construct(target, args)Reflect.get(target, name, receiver)Reflect.set(target, name, value, receiver)Refl

const obj = { name: 'zs', age: 18};const objProxy = new Proxy(obj, { get(target, property) { console.log(target, property); // { name: 'zs', age: 18 } name { name: 'zs', age: 18 } a return property in target ? target[property] : 'def.

console.log( 0 == false, // true 0 === false, // false +0 == -0, // true Object.is(+0, -0), // false NaN === NaN, // false Object.is(NaN, NaN) // true);使用Object.is()可以判断+0，-0、NaN。

const age = 18;const person = { name: 'Lily', // age: age // 属性名和属性值对应的变量名相同时可以简写： age, // sayHi: function () { // console.log(this); // console.log(`${this.name}'s age is ${this.age}`); // } // 下面的(){}与上面的: function(){} 等效 sa.

普通函数内部的this指向的是函数运行时所在的对象，this指向是可变的：const person = { name: 'Lily', sayHi: function () { console.log(`This is ${this.name}`); }}person.sayHi(); // This is Lily箭头函数内部没有自己的this对象，内部的this就是函数定义生效时其上层作用域中的this：const person = { name: 'Li.

ES6之前函数的书写：function myFun(n) { return n + 1;}console.log(myFun(10)); // 11ES6箭头函数：const myFun = n => n + 1;console.log(myFun(20)); // 21const myFun = (m, n) => { return m + n;}console.log(myFun(1, 2)); // 3ES6之前求数组中的奇数：con

ES6之前展开数组的方式1：const arr = [1, 2, 3];console.log( arr[0], arr[1], arr[2])// 1 2 3方式2：const arr = [1, 2, 3];console.log.apply(console, arr); // 1 2 3ES6展开数组可以使用rest参数的形式：const arr = [1, 2, 3];console.log(...arr); // 1 2 3...

ES6之前对于参数个数不确定的，我们使用arguments对象，如：function myFun() { console.log(arguments);}myFun([1, 2, 3]); // [Arguments] { '0': [ 1, 2, 3 ] }myFun(1, 2, 3); // [Arguments] { '0': 1, '1': 2, '2': 3 }ES6中引入了rest参数，表示方式为：...变量名，是一个真正的数组，如：function myFun

ES6之前给函数参数设置默认值的方式为：function myFun(enable) { enable = enable || true; console.log(enable);}myFun(false); // true上述代码中，当参数的赋值对应的是false时，赋值不起作用，而是使用了默认值。下面的代码也是同样的问题：function myFun(x, y) { x = x || 'hello'; y = y || 'world'; console.log

const str = 'Error: a is not defined.';console.log(str.startsWith('error')); // falseconsole.log(str.startsWith('Error')); // trueconsole.log(str.endsWith('.')); // trueconsole.log(str.includes('not')); // true

const str = console.log`hello`; // [ 'hello' ]上述代码中console.log相当于是模板字符串的标签。应用：const name = 'zs';const gender = true;function myTagFun(strings, name, gender) { console.log(strings); // [ 'hello, ', ' is a ', '.' ] const sex = gender ? 'man.

模板字符串使用的符号为：反引号const str = ` hello world `;console.log(str);输出结果为：模板字符串的反引号也可以使用转义符当作普通的符号使用：const str = `hello \`world\``;console.log(str); // hello `world`可以使用${}的方式使用变量：const name = "zs";const str = `hello ${name}`;conso..

解构时的变量名为对象中的键：const obj = { name: 'zs', age: 18 };const { name } = obj;console.log(name); // zs可以给一个键声明一个别名：const obj = { name: 'zs', age: 18 };const name = 'ls';const { name } = obj; // SyntaxError: Identifier 'name' has already been decla..

解构赋值之前我们想要获取数组中的每个元素：const arr = [1, 2, 3];const foo = arr[0];const bar = arr[1];const baz = arr[2];console.log(foo, bar, baz); // 1 2 3ES6的解构赋值：const arr = [1, 2, 3];const [foo, bar, baz] = arr;console.log(foo, bar, baz); // 1 2 3如果想要获取

1. const声明一个只读的常量。一旦声明，常量的值就不能改变：const name = "zs";name = "ls";报错：TypeError: Assignment to constant variable.上面代码表明改变常量的值会报错。2. const声明的变量不得改变值，这意味着，const一旦声明变量，就必须立即初始化，不能留到以后赋值。如下代码：const name;name = "zs";报错：SyntaxError: Missing initia.

console.log(a);var a = 1;使用var声明的变量在其声明之前使用，上述代码输出的结果为：undefined。即变量提升：var a;console.log(a);a = 1;而使用let声明变量时：console.log(a);let a = 1;在声明之前使用该变量会报错：...

for (let i = 0; i < 3; i++) { let i = 5; console.log(i);}输出结果为：由此可见，循环根据循环变量的变化执行了3次，循环变量i的变化并没有影响循环体内变量i。同一个作用域中不能使用let重复声明同一个变量：for (let i = 0; i < 3; i++) { let i = 5; let i = 15; console.log(i);}报错，提示i已经被声明：...

使用var全局声明变量i：var arr = [{}, {}, {}];for (var i = 0; i < arr.length; i++) { arr[i].onclick = function () { console.log(i); }}arr[0].onclick();arr[1].onclick();arr[2].onclick();输出结果为：原因是：i是使用var声明的全局变量，在onclick事件执行时，全局变量i已经在循环执行完毕..

ES6之前的嵌套for循环，如果给内外层循环使用同样的自增变量i：for (var i = 0; i < 3; i++) { for (var i = 0; i < 3; i++) { console.log('内层循环：' + i); }}输出结果为：使用ES6中的let给内外层循环使用同样的自增变量i：for (let i = 0; i < 3; i++) { for (let i = 0; i < 3; i++) { .

ES6之前的语法：if (true) { var foo = 1;}console.log(foo); // 1{}外部可以获取到变量foo。ES6 let声明变量及块级作用域：if (true) { let foo = 1;}console.log(foo); // ReferenceError: foo is not defined上面的代码中{}外部并不能获取到使用let声明的变量foo，在块级作用域内则可以正常获取变量：if (true) { .