setTimeout、setInterval MDN
//第三个及以后的参数
setTimeout(()=>{
alert('Second')
},1000,setTimeout(()=>{
alert('First')
},500));
//模拟setInterval
var timer = setTimeout(function() { //'use strict' : 命名函数
//doing something
timer = setTimeout(arguments.callee, interval)
}, interval);
递归
函数的调用会在内存生成"调用帧"(call frame)保存调用位置和内部变量等信息 ,若内部函数再调用还会形成记录,所有记录形成一个"调用栈"(call stack)。
递归优化:TCO优化(v8已不支持)、trampoline函数
function trampoline(fn){
while (fn && fn instanceof Function){
fn=fn();
}
return fn;
}
行内元素间隙
这个间隙来自行内元素间的空白。行内元素间的所有空白会折叠为一个,可通过html中注释删除空白。
背景图
background: "#fff url(XXX) no-repeat center center/cover"
数据方法
Object.fromEntries()
Array.prototype.flat
正则
数字:
/^\d+$/.test(parseInt(num)) // 0 及 正整数
html字符串转文档碎片
document.createRange().createContextualFragment(tagString)
管理工具
nrm: 切换源 , 参考:segmentfault.com/a/119000000…
nvm: 切换node版本 ,参考: bubkoo.com/2017/01/08/…
scroll平滑滚动, 及元素进入视区
css: scroll-behavior:smooth
js: target.scrollIntoView({behavior: "smooth"});
对象动态属性
key = 'age'
a = {
name: dylan,
...( false && {[key]: 21} || {})
}
resize窗口
window.dispatchEvent(new Event("resize"));
数组方法
Array.from({length:n},()=>'a');
[...Array(n).keys()];
Array(n).fill('a');
对象方法
//顺序遍历属性
const obj = { a: 1,b: 2}
Reflect.ownKeys(obj)
Object.getOwnPropertyNames(target).concat(Object.getOwnPropertySymbols(target))
// 包括直接挂在目标对象上的可枚举、不可枚举、Symbols的属性组成的数组, IE不支持
Object.getOwnPropertyNames(obj) // ES5, IE9+
正则匹配实现整数位的千分位
(num || 0).toString().replace(/(?<!(?:\d+\.(?:\d+?)))(\d)(?=(?:\d{3})+(?:\.\d+)?$)/g, '$1,')
// exp1(?=exp2):查找 exp2 前面的 exp1。
// (?<=exp2)exp1:查找 exp2 后面的 exp1。
// exp1(?!exp2):查找后面不是 exp2 的 exp1。
// (?<!exp2)exp1:查找前面不是 exp2 的 exp1。
// (?:exp) 匹配exp,不捕获匹配的文本,不分配组号。