博主全网搜集了2021最火面试题——js篇
1. 例举3种强制类型转换和2种隐式类型转换?
string,boolean,number,undefined,function,object2.数组方法pop() push() unshift() shift()
push()尾部添加
pop()尾部删除
unshift()头部添加
shift()头部删除
3.IE和标准下有哪些兼容性的写法
var ev = ev || window.event
document.documentElement.clientWidth || document.body.clientWidth
Var target = ev.srcElement||ev.target
4.call和apply的区别
Object.call(this,obj1,obj2,obj3)
Object.apply(this,arguments)5事件委托是什么
利用事件冒泡的原理，让自己的所触发的事件，让他的父元素代替执行！
6.闭包是什么，有什么特性，对页面有什么影响
闭包就是能够读取其他函数内部变量的函数,使得函数不被GC回收，如果过多使用闭包，容易导致内存泄露
7 .添加 删除 替换 插入到某个接点的方法
1）创建新节点
createElement() //创建一个具体的元素
createTextNode() //创建一个文本节点
2）添加、移除、替换、插入
appendChild() //添加
removeChild() //移除
replaceChild() //替换
insertBefore() //插入
3）查找
getElementsByTagName() //通过标签名称
getElementsByName() //通过元素的Name属性的值
getElementById() //通过元素Id，唯一性8.document load 和document ready的区别
document.onload 是在结构和样式,外部js以及图片加载完才执行js
document.ready是dom树创建完成就执行的方法，原生种没有这个方法，jquery中有 $().ready(function)
9函数声明与函数表达式的区别？
在Javscript中，解析器在向执行环境中加载数据时，对函数声明和函数表达式并非是一视同仁的，解析器会率先读取函数声明，
并使其在执行任何代码之前可用（可以访问），至于函数表达式，则必须等到解析器执行到它所在的代码行，才会真正被解析执行。
10.对作用域上下文和this的理解，看下列代码：
var User = {
count: 1,
getCount: function() {
return this.count;
}
};
console.log(User.getCount()); // what?
var func = User.getCount;
console.log(func()); // what?
问两处console输出什么？为什么？
答案:是1和undefined。
func是在window的上下文中被执行的，所以不会访问到count属性。11. 例举3种强制类型转换和2种隐式类型转换?
答案：强制（parseInt,parseFloat,number） 隐式（== ===）
12.Javascript的事件流模型都有什么?
var a = null; alert(typeof a); 答案：object
解释：null是一个只有一个值的数据类型，这个值就是null。表示一个空指针对象， 所以用typeof检测会返回”object”。
13.回答以下代码，alert的值分别是多少？
<script>
var a = 100;
function test(){
alert(a);
a = 10; //去掉了var 就变成定义了全局变量了
alert(a);
}
test();
alert(a);
</script>
正确答案是： 100， 10， 1014.javaScript的2种变量范围有什么不同？
全局变量：当前页面内有效 局部变量：函数方法内有效
15. null和undefined的区别？
null是一个表示"无"的对象，转为数值时为0；undefined是一个表示"无"的原始值，转为数值时为NaN。
当声明的变量还未被初始化时，变量的默认值为undefined。 null用来表示尚未存在的对象
undefined表示"缺少值"，就是此处应该有一个值，但是还没有定义。典型用法是：
（1）变量被声明了，但没有赋值时，就等于undefined。
（2）调用函数时，应该提供的参数没有提供，该参数等于undefined。 （3）对象没有赋值的属性，该属性的值为undefined。
（4）函数没有返回值时，默认返回undefined。 null表示"没有对象"，即该处不应该有值。典型用法是： （1）
作为函数的参数，表示该函数的参数不是对象。 （2） 作为对象原型链的终点。
16. js延迟加载的方式有哪些？
defer和async、动态创建DOM方式（创建script，插入到DOM中，加载完毕后callBack）、按需异步载入js
17.列举javaScript的3种主要数据类型，2种复合数据类型和2种特殊数据类型。
主要数据类型：string, boolean, number
复合数据类型：function, object
特殊类型：undefined，null
18.offsetWidth offsetHeight和clientWidth clientHeight的区别
(1)offsetWidth （content宽度+padding宽度+border宽度）
(2)offsetHeight（content高度+padding高度+border高度）
(3)clientWidth（content宽度+padding宽度）
(4)clientHeight（content高度+padding高度）
19.闭包的好处
(1)希望一个变量长期驻扎在内存当中(不被垃圾回收机制回收)
(2)避免全局变量的污染
(3)私有成员的存在
(4)安全性提高
20.冒泡排序算法
// 冒泡排序
var array = [5, 4, 3, 2, 1];
var temp = 0;
for (var i = 0; i <array.length; i++) {
for (var j = 0; j <array.length - i; j++) {
if (array[j] > array[j + 1]) {
temp = array[j + 1];
array[j + 1] = array[j];
array[j] = temp;
}
}
}21.数组去重方法
var arr = [1, 1, 8, 8, 12, 12, 15, 15, 16, 16];
// 1.es6数组去重
function unique(arr) {
return Array.from(new Set(arr))
}
console.log(unique(arr))
// 2.ES5去重(利用for嵌套for，然后splice去重)
var arr = [1, 1, 8, 8, 12, 12, 15, 15, 16, 16];
function unlink(arr){
for(var i = 0;i<arr.length;i++){
for(var j = i+1;j<arr.length; j++) {
if(arr[i] == arr[j]){
arr.splice(j, 1);
j--
}
}
}
return arr;
}
unlink(arr)
// 3、利用indexOf去重
var arr = [1, 1, 8, 8, 12, 12, 15, 15, 16, 16];
function unlink(arr) {
if (!Array.isArray(arr)) {
console.log('错误！')
return
}
var array = [];
for (var i = 0; i < arr.length; i++) { // 首次遍历数组
if (array.indexOf(arr[i]) === -1) { // 判断索引有没有等于
array.push(arr[i])
}
}
return array
}
console.log(unlink(arr));
// 4、利用filter
var arr = [1, 1, 8, 8, 12, 12, 15, 15, 16, 16];
function unlink(arr) {
return arr.filter(function (item, index, arr) {
//当前元素，在原始数组中的第一个索引==当前索引值，否则返回当前元素
return arr.indexOf(item, 0) === index;
});
}
console.log(unlink(arr));22.dom事件委托什么原理，有什么优缺点?
事件委托原理:事件冒泡机制 优点
1.可以大量节省内存占用，减少事件注册。比如ul上代理所有li的click事件就很不错。
2.可以实现当新增子对象时，无需再对其进行事件绑定，对于动态内容部分尤为合适 缺点 事件代理的常用应用应该仅限于上述需求，如果把所有事件都用事件代理，可能会出现事件误判。即本不该被触发的事件被绑定上了事件。
23.js基础数据类型和引用类型分别是什么？这个前提条件下写一个getType，返回相应的类型
1.基本数据类型（自身不可拆分的）：Undefined、Null、Boolean、Number、String
2.引用数据类型（对象）：Object （Array，Date，RegExp，Function） ES6基本数据类型多了个symbol 据说这道题刷了百分之二十的人 感谢Abbyshen提出 function gettype(nm){
return Object.prototype.toString.call(nm); }
24.proto、prototype、Object.getPrototypeOf()
__proto__是指内部原型，和Object.getPrototypeOf()结果等价
function f(){}
f.__proto__ === Object.getPrototypeOf(f); //true
f.prototype === Object.getPrototypeOf(f); //false25.setTimeout 和 setInterval 细谈
常问的点，前者是在一定时间过后将函数添加至执行队列，执行时间=延迟时间+之前函数代码执行时间+执行函数时间。
后者是不管前一次是否执行完毕，每隔一定时间重复执行，用于精准执行互相没有影响的重复操作。
如果需要控制前后执行顺序，最好使用setTimeout模拟setInterval
var time = 400, times = 0, max = 10;
function func(){
times++;
if(times < max){
//code here
setTimeout(func, time);
} else {
console.log("finished");
}
}
setTimeout(func, time);26、闭包相关
什么是闭包
闭包是指有权访问另一个函数作用域中变量的函数
怎么创建闭包
在函数内部嵌套使用函数
function fn() {
for (var i = 0; i < 2; i++) {
(function () {
var variate = i;
setTimeout(function () {
console.log("setTimeout执行后:"+variate);
}, 1000);
})();//闭包,立即执行函数,匿名函数
}
console.log(i);//2
console.log(variate);//variate is not defined
}
fn();
为什么用闭包
因为在闭包内部保持了对外部活动对象的访问,但外部的变量却无法直接访问内部,避免了全局污染;
可以当做私有成员,弥补了因js语法带来的面向对象编程的不足;
可以长久的在内存中保存一个自己想要保存的变量.
闭包的缺点
可能导致内存占用过多,因为闭包携带了自身的函数作用域
闭包只能取得外部包含函数中得最后一个值27.forEach和map的区别
相同点 都是循环遍历数组中的每一项
forEach和map方法里每次执行匿名函数都支持3个参数，参数分别是item（当前每一项）、index（索引值）、arr（原数组）
匿名函数中的this都是指向window 只能遍历数组 都有兼容问题 不同点 map速度比foreach快
map会返回一个新数组，不对原数组产生影响,foreach不会产生新数组， map因为返回数组所以可以链式操作，foreach不能
28.js加载位置区别优缺点
1.html文件是自上而下的执行方式，但引入的css和javascript的顺序有所不同，css引入执行加载时，程序仍然往下执行，而执行到<script>脚本是则中断线程，待该script脚本执行结束之后程序才继续往下执行。
所以，大部分网上讨论是将script脚本放在之后，那样dom的生成就不会因为长时间执行script脚本而延迟阻塞，加快了页面的加载速度。
2.但又不能将所有的script放在body之后，因为有一些页面的效果的实现，是需要预先动态的加载一些js脚本。所以这些脚本应该放在之前。
3.其次，不能将需要访问dom元素的js放在body之前，因为此时还没有开始生成dom，所以在body之前的访问dom元素的js会出错，或者无效
4.script放置位置的原则“页面效果实现类的js应该放在body之前，动作，交互，事件驱动，需要访问dom属性的js都可以放在body之后
