function memoizer(fundamental, cache) { let cache = cache || {}, shell = function(arg) { if (! (arg in cache)) { cache[arg] = fundamental(shell, arg); } return cache[arg]; }; return shell; }
12、闭包(Closure)：词法表示包括不被计算的变量(上下文环境中变量，非函数参数)的函数，函数可以使用函数之外定义的变量。下面以单例模式为例来讲述如何创建闭包
let singleton = function(){ let obj; return function(){ return obj || (obj = new Object()); } }();
13、New Function()：用一个字串来新建一个函数，函数参数可以this.key形式来调用：
let variables = { key1: 'value1', key2: 'value2' }, fnBody = 'return this.key1 + ":" + this.key2', fn = new Function(fnBody); console.log(fn.apply(variables));
14、DocumentFragment： Roughly speaking, a DocumentFragment is a lightweight container that can hold DOM nodes. 在维护页面DOM树时，使用文档片段document fragments 通常会起到优化性能的作用
let ul = document.getElementsByTagName("ul")[0], docfrag = document.createDocumentFragment(); const browserList = [ "Internet Explorer", "Mozilla Firefox", "Safari", "Chrome", "Opera" ]; browserList.forEach((e) => { let li = document.createElement("li"); li.textContent = e; docfrag.appendChild(li); }); ul.appendChild(docfrag);
15、forEach()遍历：另外，适当时候也可以考虑使用for 或 for ... in 或 for ... of 语句结构
1. 数组实例遍历： arr.forEach(function(item, key){
//do some things
})
2. 非数组实例遍历： Array.prototype.forEach.call(obj, function(item, key){
//do some things
})
3. 非数组实例遍历： Array.from(document.body.childNodes[0].attributes).forEach(function(item, key){
//do some things. Array.from()是ES6新增加的
})
16、DOM事件流：Graphical representation of an event dispatched in a DOM tree using the DOM event flow.If the bubbles attribute is set to false, the bubble phase will be skipped, and if stopPropagation() has been called prior to the dispatch, all phases will be skipped.
(1) 事件捕捉(Capturing Phase)：event通过target的祖先从window传播到目标的父节点。IE不支持Capturing
(2) 目标阶段(Target Phase)：event到达event的target。如果事件类型指示事件不冒泡，则event在该阶段完成后将停止
(3) 事件冒泡(Bubbling Phase)：event以相反的顺序在目标祖先中传播，从target的父节点开始，到window结束
事件绑定：
1. Tag事件属性绑定：<button></button>
2. 元素Node方法属性绑定：btnNode.onclick = function(){//do some things}
3. 注册EventListener：btnNode.addEventListener('click', eventHandler, bubble)；另外，IE下实现与W3C有点不同，btnNode.attachEvent(‘onclick', eventHandler)
17、递归与栈溢出(Stack Overflow) ：递归非常耗费内存，因为需要同时保存成千上百个调用帧，很容易发生“栈溢出”错误；而尾递归优化后，函数的调用栈会改写，只保留一个调用记录，但这两个变量(func.arguments、func.caller，严格模式“use strict”会禁用这两个变量，所以尾调用模式仅在严格模式下生效)就会失真。在正常模式下或者那些不支持该功能的环境中，采用“循环”替换“递归”，减少调用栈，就不会溢出
function Fibonacci (n) { if ( n <= 1 ) {return 1}; return Fibonacci(n - 1) + Fibonacci(n - 2); } Fibonacci(10); // 89 Fibonacci(50);// 20365011074，耗时10分钟左右才能出结果 Fibonacci(100);// 这里就一直出不了结果，也没有错误提示 function Fibonacci2 (n , ac1 = 1 , ac2 = 1) { if( n <= 1 ) {return ac2}; return Fibonacci2 (n - 1, ac2, ac1 + ac2); } Fibonacci2(100) // 573147844013817200000 Fibonacci2(1000) // 7.0330367711422765e+208 Fibonacci2(10000) // Infinity. "Uncaught RangeError:Maximum call stack size exceeded"