- 解构赋值
从对象或数组中提取数值,赋值于另一个变量。(Destructuring);
// use with object
function say({name='komolei',age=24,sex='male'}){
console.log('arguments',name,age,sex)}
say() // error // 应该改为say({}) // arguments komolei 24 male
say({age:22}) // arguments komolei 22 male
// use with Map or Set
const m = new Map();
m.set('one',{name:'komolei'});
m.set('seconde','dd');
for (let [,value] of m) {
console.log(`value`,value)} // {name:'komolei'} dd
// 这个也不错
function people(){
return {name:'clc',age:22}}
let {name,age}=people();
name // clc
age //22
- symbol //标识
// 1997年前的js原始类型:
// null ,undefined,string,boolean,number,object
// 现在增加一个新的原始类型
// symbol 充当标示符
还有就是
const a=Symbol('a')
// 不能直接使用到模板字符串中,如
console.log(`xixi ${a}`) // error
// 可以通过Sting(a)或a.toString() 进行covert
// 生成方法:
1. Symbol() 2.Symbol.for() // 注册表使用,理解为大范围使用同一个symbol的时候。其是为共享的 3. Symbol.iterator
- set and map 没有则返回undefined ,都有的方法:keys(),values(),entries(),forEach()
哈希表(hash table):是一种以key存储在内存中的数据结构。是根据key来直接访问在内存存储位置的数据结构。
- set: 类似array ,set,add(),delete(),clear(),has()
数组去重:Array.from() //将其变成数组
new Set() //利用set没有重复的值的属性
综上:let a=new Set(Array.from([3,4,5,5]));//a:[3,4,5]
//注意;这个变成了Set construct。so should do this:
let aa=Array.from(new Set([3,3,4,4,5])); //aa:[3,4,5]
- map:类似object ,size,get(),set(),delete(),clear(),has()
const m=new Map() //better key-value way
m.set(name,'komolei')
m.get(name) //komolei
2. support chain invoked
m.set('age',22).set('sex','female')
3. for...of --> keys(),values(),entries(),forEach()
const map=new Map([[{name:'komolei'}],{age:22},22]); // map是个对象。所以定义出差,
改为
const map=new Map([[{name:'komolei'}],{age:22},{xx:22}])
let a=map.keys(); // name,age,22
let b=map.values(); // komolei,22,
let c=map.entries(); //[name:'komolei'],{age:22},22 //上面error
改为
const map=new Map([['p',{name:'komolei'}],[{age:22},{xx:2222}]]);
let a=map.keys() //'p',undefined //error // 应该返回'p',{age:22}
let b=map.values() // {name:'komolei'},{age:22},{xx:2222} //应该返回 {name:'komolei'},{xx:2222}
3. 跟array的相互转化
let a1=[...a] // [p,{age:22}]
- class
js的class是根据原型链来模拟生成的。相当于语法糖。
不同的版本,类的写法不一样
function People(name, age) {
this.name = !name ? 'clc' : name;
this.age = !age ? 24 : age;
// function sayName() {
// return this.name;
// }
// function getAge(){
// return this.age;
// }
this.sayName();
}
People.prototype = { sayName: function () { return this.name }, getAge: function () { return this.age } }
const c = new People('komolei');
// 好吧。忘记es5的继承是怎么写的。复习一下
function Person(sex) {
this.sex=sex;
People.call(this)
}
Person.prototype = new People();
Person.prototype = People.prototype;
reference
class People {
constructor(name, age) {
this.name = name;
this.age = age;
this.value = null;
}
sayName() {
return this.name;
};
getAge() {
return this.age;
}
set(value) {
return this.value = value;
}
// static // 静态方法。是类所拥有的,并不会被实例对象所使用。
// new 出来的对象,并不能调用static开头的方法
static get() {
return this.name.split('').join('!');
}
}
const p = new People('komolei', 24);
console.log(p.sayName());
console.log(People.get());
// 添加私有属性
// 现在只能添加
People.sex={};
// 继承
class Person extends People {
constructor(name, age, sex) {
super(name, age);
this.sex = sex;
}
getSex() {
return this.sex;
}
}
const per=new Person('clc',24,'male');
console.log('person',per.sayName()); //这个sayName()是被继承而来的,来自于People.
- generators(生成器)
// 普通函数以function开头,而generators以function*开头
// 普通函数开始运行时,不能停止,最后会return一个值,而generators以yield作为return的替换,同时运行可以暂停。使用next,进入下一个yield。
function* say(name){
yield 'hello generator'
yield 'yes'
if(name.length>0){yield 'good'}
yield 'say you' }
const s = say('dd'); //初始化 //状态为 suspended
s.next() // hello generator
s.next() // yes
s.next() // 进入判断,得到 good
s.next() // say you
s.next() // undefined // 状态为closed
// 可以解决异步回调地狱 // 跟async和await一样吧。在使用过程中,generators还是用的少。
// 同时generators的本质还是iteration(迭代器)
- string
平常在使用的过程中,字符串的增删改查?增很少,通常是通过+来完成的,但是今天刚刚看见。在string的原型链上还有concat方法。多看书的好处啊
- Proxy(代理)
- 什么是对象?
一堆键值对的聚合。?一堆属性的集合?
当我经常在使用Js的对象的时候,却忘记对象是什么?Mdn说对象,一系列的属性的聚合,一个属性包含一个名和一个对应的值,其中当对应的值是函数的时候,这个属性叫做方法,而不是这个函数叫做方法。不过貌似自己经常叫函数为方法。
- Js
对于Js而言。在初始化对象的时候,在其的内部包含着东西,想想原型链那样。就像我们身上的灵魂一样,看不见,但是组成了我们。
现在通过proxy就能改变内部方法,多么美妙,就跟灵魂的改造一样。曾经触碰不到的宇宙的奥妙,现在通过一扇门向我们敞开。
- example
let target={},handler={};
const proxy = new Proxy(target, handler);
proxy.color='red'; //这个时候 target为{ color:'red'};
// 多么奇怪,我们没有给target进行添加属性,但是它就在了。
// 解析:一般我们对于一个对象进行这样的操作的时候:
let obj={}; obj.name='komolei' //其实obj.name这个operation 是在调用obj中的[[set]]方法
- proxy :将代理的内部所有方法转发到target中去
// 上面的例子中 proxy.color='red'
实际上是proxy.[[set]]()调用了target.[[set]](),就像灵魂的交流一样。
但是有时候,你会发现目标对象不会接收proxy的信息,就像吵架的人一样,一方不听一方说辞一样。
即:target可以设置对象,让proxy无法转发信息到其内部。
- 句柄对象:记得上面说过js的最内部的方法有14种,现在通过句柄对象的方法可以重写这些方法。
let target={},handler={set:function(target,value){
throw new Error('prohibit set') };
let proxy=new Proxy(target,handler);
proxy.color = 'red'; // prohibit set
// 现在我们无法对对象进行set operation了,这就像人生气,没有都不会听进去一样。
- 对象是在js中拥有[[get]],[[set]]等操作的实体
- reflect (反射)
个人理解:JS中的反射,是为了分离obj,因为js中的对象有很多的方法。太杂乱了,分离出来,让灵魂更加纯净。
看了一些,还是这篇推荐一波Reference