- js中，调用
Object.prototype.toString.call(a)和调用a.toString()结果不同，除非a是一个对象。 - 解构赋值
let {a,b,...c}={a:1,b:2,u:3,v:4};
console.log(c);//{u:3,v:4}
var a=(function(x){
delete x;
return x;
})(2);
console.log(a);//2
var a=1;
console.log(global.a);//undefined
console.log(delete a);//false
console.log(typeof a);//number
console.log(a);//1
/*原因：使用var声明的变量有一个名为[[Configurable]]的特性，
且被设置为false，因此不能通过delete操作符删除，会返回false*/
a=1;
console.log(global.a);//1
console.log(delete a);//true
console.log(typeof a);//undefined
console.log(a);//ReferenceError: a is not defined
var a={},
b={key:'b'},
c={key:'c'};
a[b]=123;
a[c]=456;
console.log(a[b]);//456
console.log(a);//Object {[object Object]: 456}
原因：a[variable]相当于给对象a添加了一个属性，而属性的key就是variable.toString()的结果，Object类型的b和c的b.toString()和c.toString()的结果均为"[object Object]"，所以a[c]就会把a[b]覆盖
- 在任何值上调用Object原生的
toString()方法，都会返回一个"[object NativeConstructorName]"格式的字符串。每个类在内部都有一个[[Class]]属性，这个属性中就指定流量上述字符串中的构造函数名。（与第一点中的照应）。 - 在对非数值应用一元加操作符时，该操作符会像
Number()转型函数一样对这个值执行转换。 -
Number()转型函数规则 - 添加动态脚本
①document.write()，接收一个字符串，且<script>...</script>要写成<script>...<\/script>
②创建<script>元素，指定src（或者script.appendChild(document.createTextNode("js代码"))），document.body.appendChild() - 添加动态样式
①创建<link>元素，指定href(或者创建style元素style.appendChild(document.createTextNode("css代码"))），document.head.appendChild()
② - 有关添加、删除、获取属性的四种方式
①ele.getAttribute("name") setAttribute("class") remove...
②通过HTML属性如ele.id、ele.title、ele.style、ele.className
③通过ele.attributes属性获得NodeList，ele.attributes.getNamedItem("id").nodeValueORele.attributes["id"].nodeValue
④
var attr=document.createAttribute("name");
attr.value="aaaaa";
ele.setAttributeNode(attr);
- 返回
NodeLIst（包括NodeList、HTMLCollection、NamedNodeMap）的方法：childNodes、getElementsByTagName()、getElementsByName()、element.attributes、getElementsByClassName()、children、form.elements - 为单例对象创建私有变量
var sigleton=function(){
var privateVar=10;
function privateFunc(){
return false;
}
return{
publicVar:"hahaha",
publicFunc:function(){
privateVar++;
return privateFunc;
}
}
}();
console.log(sigleton.privateVar);//undefined
console.log(sigleton.publicVar);//"hahaha"
console.log(sigleton.publicFunc()());//false
- 惰性载入函数两种方法：
①在函数第一次执行时将函数重新覆盖为一个适当的函数（在第一次执行时损失性能）
function createXHR(){
if(xxx){
createXHR=function(){
//...
};
}else if(yyy){
createXHR=function(){
//...
};
}else{
createXHR=function(){
//...
};
}
return createXHR();
}
②在函数第一次声明函数时就指定适当的函数（在第一次加载时损失性能）
var createXHR=function(){
if(xxx){
return function(){
//...
}
}else if(yyy){
return function(){
//...
}
}else{
return function(){
//...
}
}
}();
- 函数柯里化
- 函数绑定
-
Object.create()的内部实现：
function object(o){
function F(){}
F.prototype=o;
return new F();
}
除此之外，Object.create()还有一个可选的第二个参数，一个对象，表示新对象的可选属性。e.g.
var aPerson=Object.create(Person.prototype,{
name:{
value:"Xiaoming"
}
});
- 创建对象的方式
- 工厂模式
- 构造函数模式
- 原型模式
- 组合使用构造函数模式和原型模式
- 动态原型模式
- 字面量
- Object.create()
- 继承方式
①原型链继承
②构造函数继承
③组合继承（原型链+构造函数）
④原型式继承
⑤寄生组合式继承 -
e.getAttribute(propName)和e.propName的区别和联系
- e.getAttribute()返回值是源文件中设置的值，类型是字符串或者null（有的实现返回""）
- e.propName返回值可能是字符串、布尔值、对象、undefined等（尤其是对于style属性和函数）
- 大部分attribute与property是一一对应关系，修改其中一个会影响另一个，如id，title等属性
-
opacity:0：视觉隐藏，占据布局，可以交互 -
visibility:hidden：视觉隐藏，占据布局，屏蔽交互 -
display:none：真正隐藏，真正渲染，屏蔽过渡效果，可以通过dom访问
页面重绘（repaint）和页面回流（reflow）：
- 重绘(repaint)：当render tree中的一些元素需要更新属性，单这些属性只会影响元素的外观，风格，而不会影响到元素的布局，此类的页面渲染叫作页面重绘。
- 回流(reflow)：当render tree中的一部分（或全部）因为元素的规模尺寸，布局，隐藏等改变而引起的页面重新渲染。
可以看出，回流必将引起重绘，而重绘不一定会引起回流。
引发回流的事件： - DOM树发生变化
- 元素尺寸的改变
- 由于内容改变引发的尺寸变化
- 浏览器窗口大小改变（resize事件触发）
改善由dom操作引起的回流： - 使用DocumentFragment进行缓存操作,引发一次回流和重绘
- 使用display:none技术，只引发两次回流和重绘
- 使用cloneNode(true or false) 和 replaceChild 技术，引发一次回流和重绘。
- 输入URL到显示界面中发生了什么
- 发生内存泄露的情况
- 被遗忘的计时器
- 脱离dom的引用
- 闭包
- 循环引用（IE中）
- cookie、sessionStorage、localStorage区别
- 都会在浏览器端保存，有大小限制，同源限制
- cookie会在请求时发送到服务器，作为会话标识，服务器可修改cookie；web storage不会发送到服务器
- cookie有path概念，子路径可以访问父路径cookie，父路径不能访问子路径cookie
- 有效期：cookie在设置的有效期内有效，默认为浏览器关闭；sessionStorage在窗口关闭前有效，localStorage长期有效，直到用户删除
- 共享：sessionStorage不能共享，localStorage在同源文档之间共享，cookie在同源且符合path规则的文档之间共享
- localStorage的修改会促发其他文档窗口的update事件
- cookie有secure属性要求HTTPS传输
- 浏览器不能保存超过300个cookie，单个服务器不能超过20个，每个cookie不能超过4k。web stora e大小支持能达到5M
- CSS中position四个值的区别（static、relative、absolute、fixed）
- static
static（静态定位）：默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right 或者 z-index 声明）。 - relative
relative（相对定位）：生成相对定位的元素，通过top,bottom,left,right的设置相对于其正常（原先本身）位置进行定位。可通过z-index进行层次分级。
定位为relative的元素遵循常规流，参照自身在常规流中的位置进行移动，但其原先在文本流中的位置依然存在。 - absolute
absolute（绝对定位）：生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。可通过z-index进行层次分级。
定位为absolute的层脱离正常文本流，但与relative的区别是其在正常流中的位置不再存在。 - fixed
生成绝对定位的元素，相对于浏览器窗口进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。可通过z-index进行层次分级。
- ES新特性：
- promise√
- 箭头函数√
- let、const和块级作用域
没有变量提升 - Symbol√
- Set和Map√
- class和继承√
- Git基本操作
- 数组去重、数组乱序、深拷贝、浅拷贝
