JavaScript 笔记

Proxy

深拷贝: JSON.parse(JSON.stringify(...)) 浅拷贝: const savedCartItems = [...state.cart.added]

Object.keys Object.values

map和reduce的掌握

promise捕获未handle的reject事件

window.addEventListener('unhandledrejection', event => {
	console.log(event.reason);
});

promise Object.assign

async/await

/////////////////
在节点的事件拦截需要挂到父节点才能拦截到

////////////////
打点调试耗时

console.time('Timer1');
var items = [];
for(var i = 0; i < 100000; i++){
  items.push({index: i});
}
console.timeEnd('Timer1');

/////////////////
string转number

~~"abc" => 0
+"abc"  => NaN
parsInt("abc", 10) => NaN
~~undefinded => 0
+undefinded  => NaN
parsInt(undefinded, 10) => NaN

/////////////////
clientX pageX offsetX layerX 的区别 PageX: 相对于document clientX: 相对于浏览器可视区域 screenX: 鼠标在屏幕上的位置,从屏幕左上角开始,这个没有任何争议,不讨论 ^_^ offsetX: IE特有,鼠标相比较于触发事件的元素的位置,以元素盒子模型的内容区域的左上角为参考点,如果有boder,可能出现负值 layerX: FF特有,鼠标相比较于当前坐标系的位置,即如果触发元素没有设置绝对定位或相对定位,以页面为参考点,如果有,将改变参考坐标系,从触发元素盒子模型的border区域的左上角为参考点

/////////////////
记住正则的使用方式,不要每次都查收册

string.match(pattern)

/////////////////
字符串模版函数传入的字符串数组不支持修改

/////////////////
有3个页面 a,b,c 如果当前页面是c页面,并且c页面是这样跳转过来的:a->b->c 1:b->c 是通过window.location.replace("..xx/c")   此时b页面的url会被c页面代替,并且点击后退按钮时会回退到a页面(最开始的页面) 2:b->c是通过window.location.href("..xx/c")    此时b页面的路径会被c页面代替,但是点击回按钮后页面回退的是b页面

两者的区别: 两者后退时所回退的页面不一样

/////////////////
浅复制可以使用Object.assign

/////////////////
Event Loop: task主要包含:setTimeout、setInterval、setImmediate、I/O、UI交互事件 microtask主要包含:Promise、process.nextTick、MutaionObserver microtask: 但是它们引入了一个更加明确、更有保证的执行顺序:稍后执行,但是会尽快执行。

/////////////////
异步加载资源,通过在promise里面去完成,但是我怎么记得webpack支持的动态import就是支持的捏

loadSocketIO() {
  return new Promise(resolve => {
    require(['socket.io-client'], resolve);
  }).timeout(10000, 'Socket.io load timeout');
}

cancel a touchmove event with cancelable=false e.cancelable && e.preventDefault()

NaN是可以转换为false的 !!NaN -> false NaN || 0 -> 0

scroll事件不会做分发, touch系列才会

~~做字符串转换对大数字有问题, 比如时间戳(带毫秒)的转化是不正确的

typeof 对于基本类型,除了 null 都可以显示正确的类型 typeof 对于对象,除了函数都会显示 object instanceof 可以正确的判断对象的类型,因为内部机制是通过判断对象的原型链中是不是能找到类型的 prototype。

////////\

function Person(name) {
    this.name = name
    return name;
}
let p = new Person('Tom'); // p -> {name: 'Tom'}

function Person(name) {
    this.name = name
    return {
      title: name
    };
}
var p1 = new Person('Tom'); // p1 -> {title: 'Tom'}

////////
json U+2028/2029

https://zhuanlan.zhihu.com/p/29958439 https://github.com/tc39/proposal-json-superset

////////
所以分号是必须的

var a,b,c,d,e,f;
[a,b,c] = [1,2,3]
[d,e,f] = [3,2,1]

console.log(a,b,c,d,e,f)
VM18751:1 3 2 1 undefined undefined undefined
const a = {3: [3,2,1]}

[1,2,3].map(i => console.log(i))

VM18751: 3
VM18751: 2
VM18751: 1