个人遇到的面试知识点：

1.怎么判断一个变量是数组还是对象

 

2.type of和instance of的区别

 instance of的返回值是布尔类型，而type of的返回值可以有number、boolean、string、function、object、undefined

 

3.字符串有哪些方法

charAt()、 indexOf()、lastIndexOf()、substring()、slice()、substr()、replace()、search()查找str与一个正则表达式是否匹配如果匹配成功则返回正则表达式在字符串中首次匹配项的索引否则返回-1、match()返回一个包含匹配结果的数组、split()返回一个数组、trim()、toLowerCase()、toUpperCase()后边这三个方法返回str的副本不影响本身

 

4.slice和substring的区别

slice的参数可以为负，substring不可以若传入负值则视为0

 

5.类和面向对象的概念

6.讲讲单线程和多线程

 

7.nodeJS中的global有哪些方法

  setTimeout、clearTimeout、setInterval、clearInterval、console

 

8.怎么生成对象

工厂模式、原型继承、直接定义、字面量

 

9.怎么把数组清空

array.length=0

 

10.js中有哪些循环？for in和for of的区别

for in循环键名key，for of循环值value且for of是es6新添加的特性,for of只可以循环可迭代对象的可迭代属性

 

11.了解数据结构和软件工程吗？

12.二叉树

 

13.数组的去重方法

Set数据结构，它类似于数组，其成员的值都是唯一的。

利用Array.from将Set结构转换成数组

function dedupe(array){
 return Array.from(new Set(array));
}
dedupe([1,1,2,3]) //[1,2,3]

拓展运算符(...)内部使用for...of循环

let arr = [1,2,3,3];
let resultarr = [...new Set(arr)]; 
console.log(resultarr); //[1,2,3]

 http://www.jb51.net/article/118657.htm

 

14.call和apply的区别

不同点：call的第二个参数可以接受任意个参数，apply最多只有两个参数，第二个数组接收数组或类数组但都会被转换成类数组传入func中

相同点：都能够改变方法的执行上下文（执行环境），将一个对象的方法交给另一个对象来执行，并且是立即执行

https://www.jianshu.com/p/131ce0390cf8 

 

15.get和post的区别

  • GET在浏览器回退时是无害的，而POST会再次提交请求。

     

  • GET产生的URL地址可以被Bookmark，而POST不可以。

     

  • GET请求会被浏览器主动cache，而POST不会，除非手动设置。

     

  • GET请求只能进行url编码，而POST支持多种编码方式。

     

  • GET请求参数会被完整保留在浏览器历史记录里，而POST中的参数不会被保留。

     

  • GET请求在URL中传送的参数是有长度限制的，而POST么有。

     

  • 对参数的数据类型，GET只接受ASCII字符，而POST没有限制。

     

  • GET比POST更不安全，因为参数直接暴露在URL上，所以不能用来传递敏感信息。

     

  • GET参数通过URL传递，POST放在Request body中。

GET和POST本质上就是TCP链接，并无差别。但是由于HTTP的规定和浏览器/服务器的限制，导致他们在应用过程中体现出一些不同。 

GET和POST还有一个重大区别，简单的说：

GET产生一个TCP数据包；POST产生两个TCP数据包。

长的说：

对于GET方式的请求，浏览器会把http header和data一并发送出去，服务器响应200（返回数据）；

而对于POST，浏览器先发送header，服务器响应100 continue，浏览器再发送data，服务器响应200 ok（返回数据）。

 

因为POST需要两步，时间上消耗的要多一点，看起来GET比POST更有效。因此Yahoo团队有推荐用GET替换POST来优化网站性能。但这是一个坑！跳入需谨慎。为什么？

1. GET与POST都有自己的语义，不能随便混用。

2. 据研究，在网络环境好的情况下，发一次包的时间和发两次包的时间差别基本可以无视。而在网络环境差的情况下，两次包的TCP在验证数据包完整性上，有非常大的优点。

3. 并不是所有浏览器都会在POST中发送两次包，Firefox就只发送一次。

参考链接：http://mp.weixin.qq.com/s?__biz=MzI3NzIzMzg3Mw==&mid=100000054&idx=1&sn=71f6c214f3833d9ca20b9f7dcd9d33e4#rd 

 

16.css中的三角形怎么画

#triangle-up {
    width: 0;
    height: 0;
    border-left: 50px solid transparent;//其余两边颜色为transparent
    border-right: 50px solid transparent;
    border-bottom: 100px solid red;//此时三角形方向向上所以对应的bottom要有高度和颜色，其他方向的三角形同理
}

 

 

 

17.css中怎么清除浮动

父级div定义 伪类:after 和 zoom

.clearfloat:after{display:block;clear:both;content:"";visibility:hidden;height:0} 
.clearfloat{zoom:1}

原理：IE8以上和非IE浏览器才支持:after，原理和方法2有点类似，zoom(IE转有属性)可解决ie6,ie7浮动问题

优点：浏览器支持好、不容易出现怪问题（目前：大型网站都有使用，如：腾迅，网易，新浪等等）

缺点：代码多、不少初学者不理解原理，要两句代码结合使用才能让主流浏览器都支持。

建议：推荐使用，建议定义公共类，以减少CSS代码。

http://www.jb51.net/css/173023.html

 

18.ES6新增了哪些东西，let和const定义的值可以改变吗？

let 声明变量，变量不会被提升

for 循环中 使用let 定义变量，只在for的循环周期内可以使用。

 

const 除了不能改变物理指针的特性，其他特性和 let 一样。

当声明普通数据类型的时候，那么一但声明了，就不可以再改变。

当声明复杂数据类型的时候，物理指针不可以改变，但是可以改变数据内的属性值，以及可以给数据添加新属性等操作

https://www.cnblogs.com/copperhaze/p/6145302.html 

 

19.基本类型和引用类型的区别？

基本类型：存放在栈中

引用类型：存放在堆中

 

20.display:inline-flex

 

21.drop-shadow

 drop-shadow和box-shadow参数一样，但box-shadow的阴影距离更小，色值要更深

box-shadow支持inset内阴影但drop-shadow没有

 drop-shadow不能阴影叠加

drop-shadow不仅可以穿透代码构建的元素的透明部分，PNG图片的透明部分也是可以穿透的,但是box-shadow是盒阴影

 drop-shadow的实际应用：实现尖角带阴影的提示面板效果

 

 22.websocket

主要被服务器主动向客户端传输数据，因为一般情况下，只有客户端向服务器请求时，服务器才会传数据

 

23.div如何在body中垂直左右居中？

用position:absolute相对定位

 

24.ajax怎么跨域？

代理（需要后台设置）、jsonp、xhr2

 

25.jquery对象怎么转换为dom对象？

（1）jQuery 对象是一个数据对象，可以通过 [index] 的方法，来得到相应的 DOM 对象

var $v = $("#v"); //jQuery 对象
var v = $v[0]; //DOM 对象
alert(v.checked); //检测这个checkbox是否被选中

 

（2）jQuery 本身提供，通过.get(index) 方法得到相应的 DOM 对象

var $v = $("#v"); //jQuery 对象
var v = $v.get(0); //DOM对象 ( $v.get()[0] 也可以 )
alert(v.checked); //检测这个 checkbox 是否被选中  HTML DOM checked 属性




 以下写法都正确：




$("#div").html();

$("#div")[0].innerHTML;

$("#div").eq(0)[0].innerHTML;

$("#div").get(0).innerHTML;

$(document.getElementById("div")).html();




 


26.eq的用法？


eq() 方法将匹配元素集缩减值指定 index 上的一个。


如果给定表示 DOM 元素集合的 jQuery 对象，.eq() 方法会用集合中的一个元素构造一个新的 jQuery 对象。所使用的 index 参数标示集合中元素的位置。 


 


27.webworker


web worker 是运行在后台的 JavaScript，不会影响页面的性能。


当在 HTML 页面中执行脚本时，页面的状态是不可响应的，直到脚本已完成。


web worker 是运行在后台的 JavaScript，独立于其他脚本，不会影响页面的性能。您可以继续做任何愿意做的事情：点击、选取内容等等，而此时 web worker 在后台运行。


 


由于 web worker 位于外部文件中，它们无法访问下例 JavaScript 对象：


    

  • window 对象
    • 

  • document 对象
    • 

  • parent 对象
    • 



 


28.restful


 


29.vw和百分比的区别


和rem与em之间的区别有点类似，rem是针对于根节点的，而em是针对于父级的。vw就类似于rem也是针对于整体的父元素，而百分比就是和最近的父元素比较，如果层级多了就很乱。


 


30.伪类和伪元素


 


 


31.观察者模式中的类和对象


 


32.用递归的方法找出一个树结构中数据相同的节点有几个？


 


33.jquery中的defer（用到了then）


 


34.立即执行函数中的闭包为什么要传进去一些参数值进去呢？


可能某个情境下，包裹着立即函数的函数作用域内定义的有对象属性和方法，而闭包内用到了外边对象的属性，这时可能这个属性有很多值，而立即函数如果不传参数就会取呢个属性的最后一个值。这种情况是不行的，传参就是为了要让整体上下文运行时都能取到当前的值。


 


35.css中有一个针对ios中页面滚动的属性


 


36.白屏的优化


 


37.flex的好处


 


 


 


 


 


 


3.web安全：xss、csrf