0xBrooke

**事件捕获** 由网景最先提出，事件会从最外层开始发生，直到最具体的元素，也就是说假如父元素与子元素都绑定有点击事件，又互相重叠，那么先出发的会是父元素的事件，然后再传递到子元素。 **事件冒泡** 由微软提出，事件会从最内从的元素开始发生，再向外传播，正好与事件捕获相反。 这两个概念都是为了解决页面中事件流的发生顺序，w3c采取了折中的办法，制定了统一的标准：先捕获再冒泡。 **addEventListen(event, function, useCapture)添加事件的第三个参数默认值为false，即默认使用事件冒泡，若为true则使用事件捕获的机制，** 例如： ``` 我是事件冒泡 我是事件捕获 // 事件冒泡 let divFalse = document.getElementById("divFalse"); let butfalse = document.getElementById("butfalse"); divFalse.addEventListener("click", function (e) { console.log("divFalse") }, false); butfalse.addEventListener("click",...

节流就是在规定的时间间隔内触发一次事件。在不影响功能的前提下，避免一定时间内多次执行某个事件，提升性能，减少浏览器或者服务器的压力。 **还是以“包治百病”为例: 节流就是女朋友耍无赖，还特别馋，我不管这10天有没有吃过零食，每隔10天，你就要给我买一次包（败家）。防抖呢：只有连续的10天一次没有吃过零食，才能买一次包，否则每吃一次零食，就从头开始就算天数，哈哈..（尽量找这样的女朋）.** **应用场景：** **实现dom元素的拖拽功能** **在页面滚动时判断是否滚动的页面底部，来加载更多** **Canvas画笔功能** ``` function throttle(fn, delay = 500) { var prev = Date.now(); return function () { var context = this; var args = arguments;...

浅拷贝和深拷贝都只针对于引用数据类型。 - 浅拷贝只能拷贝第一层的元素,如果值中还有对象的话,二者享用相同地址，共享一个对象； - 深拷贝复制变量值，对于非基本类型的变量，则递归至基本类型变量后，再复制。不共享一个对象，两者互不影响 浅拷贝： **for 循环 扩展运算符 let newObj = {...obj}； 合并对象 Object.assgin({},obj) 创建新对象 Object.creact({},obj) 数组的方法 slice()** 深拷贝： - 深拷贝复制变量值，对于非基本类型的变量，则递归至基本类型变量后，再复制。 - 深拷贝后的对象与原来的对象是完全隔离的，互不影响. 1.深拷贝最简单的实现是: **JSON.parse(JSON.stringify(obj))** **但是此方法有一定的局限性，当对象中的属性值是funtion时，是无法拷贝的** 2.递归 ``` function...

1. H5新增属性 async Chrome、Firefox、IE9&IE9+均支持（IE6~8不支持）。 2. H4的属性 defer 兼容所有浏览器。 **这两个方法的区别** 1、defer脚本的执行会在window.onload之前，其他没有添加defer属性的script标签之后。 2、async会让脚本在下载完可用时立即执行，而defer脚本则会在dom加载完毕后执行， 3、async不能确保加载执行的顺序，多个 defer 脚本，会按照它们在页面出现的顺序加载  3.动态创建script标签 ``` (function () { var s = document.createElement_x('script'); s.type = 'text/javascript'; s.src = "http://code.jquery.com/jquery-1.7.2.min.js";...

``` var arr = [1, [2, 3], [4, [7, 9]], { name: "kk", age: [23, 32] }]; // 一 递归方法 function _flattenDeep(arr) { var newArr = []; if (Array.isArray(arr)) {...

**补充加深理解** **可执行代码分为三种：全局代码，evel中的代码，函数中的代码；** 跟我们关系最密切的自然是函数代码的执行，尤其是作为回调函数。This从何而来呢？我们慢慢分析。 当控制流进入到一个函数内时需要创建一个环境用以执行代码，我们称之为执行上下文（不同于上下文），执行上下文包含词法环境、变量环境和this。前两项可以看为同一个标识符环境，仅在少有的情况会产生差异。根据ES5.1 10.4.3文档中的描述在严格模式下将直接指向thisArg；非严格模式下有如下判断： 1.如果为null或undefined，this指向window； 2.否则对thisArg进行类型检测，不是object类型时this指向toObject(thisArg)的返回值； 3.否则this指向thisArg。 ### 用伪代码来演示如下： **if(hasStrict){ this = thisArg; }else if(thisArg === null || thisArg === undefined){ this = window; }else if(type(thisArg) !== object){ this...

1. display:none; (不占位隐藏) 2. visibility:hidden; (占位隐藏) 3. opacity:0; (占位) 4. width: 0;height: 0; overflow: hidden;(不占位隐藏) 5. position:absolute;left:-999%;(fixed;)( 移出可视区域，不占位) 6. position:relative;left:-999%;( 移出可视区域，占位) 7. transform: scale(0);(缩放，占位) 8. transform: translateY(-999%);(移出可视区域，占位) 9. margin-left:-999%;(移出可视区域，占位)

**XSS**： Cross-Site Scripting（跨站脚本攻击）简称 XSS，是一种代码注入攻击。攻击者通过在目标网站上注入恶意脚本，使之在用户的浏览器上运行。利用这些恶意脚本，攻击者可获取用户的敏感信息如 Cookie、SessionID 等，进而危害数据安全。 **XSS 的本质是**：恶意代码未经过滤，与网站正常的代码混在一起；浏览器无法分辨哪些脚本是可信的，导致恶意脚本被执行。 而由于直接在用户的终端执行，恶意代码能够直接获取用户的信息，或者利用这些信息冒充用户向网站发起攻击者定义的请求。在部分情况下，由于输入的限制，注入的恶意脚本比较短。但可以通过引入外部的脚本，并由浏览器执行，来完成比较复杂的攻击策略 **XSS分类**： XSS 攻击可分为 **存储型、反射型和 DOM 型三种。** **存储型 XSS** 存储型 XSS 的攻击步骤： 1.攻击者将恶意代码提交到目标网站的数据库中。 2.用户打开目标网站时，网站服务端将恶意代码从数据库取出，拼接在 HTML 中返回给浏览器。 3.用户浏览器接收到响应后解析执行，混在其中的恶意代码也被执行。 4.恶意代码窃取用户数据并发送到攻击者的网站，或者冒充用户的行为，调用目标网站接口执行攻击者指定的操作。 **这种攻击常见于带有用户保存数据的网站功能，如论坛发帖、商品评论、用户私信等。** **反射型 XSS** 反射型...