前端JS笔试面试题目
面试考察的是对整个知识体系的把握，所以要多多的总结，不要小看这些一个个的知识点，串在一起的时候，就是大问题了
1 JS中使用typeof能得到哪些类型
考点：JS的变量类型 number boolean string undefined object function
扩展：如何判读一个变量是数组类型
instanceof：判断一个函数是否是一个变量的构造函数
var arr=[1,2,3] arr instanceof Array //true
这个Array其实是一个构造函数，var arr=[1,2,3]其实就是一个语法糖，真实情况是这样子的var arr=new Array(1,2,3)
扩展：如何理解json
json是JS当中的一个内置对象，有两个常用的API，如下，他不是函数，和Math一样，是一个内置的对象，同时，json也是一种数据格式
JSON.stringify({a:10,b:20})
JSON.parse('{"a:"10","b":"20"}')
扩展：JS当中的内置函数 Object Array Function Boolean String Number Date RegExp Error
2 何时使用 == ?，何时使用 ===?
考点：强制类型转换
扩展：什么时候发生强制类型转换
当你需要判断对象是否有某个属性的时候，就用==
obj.a==null 相当于 obj.a===undefined||obj.a===null
还有一种情况，判读函数的参数，是否有值
function find(a,b){ if(a==null){ } }
其他的情况下，为了保证不发生强制类型转换，全部用===
什么时候发生强制类型转换?
1)字符串拼接
var a=100+'10' //10010 var a=100+10 //110
2)==符号
'1000'==100 //true ''==false //true null==undefined //true
3) if 语句
if(100){ console.log("ok") //ok } if(''){ console.log("ok") //打印不出来 })
4)逻辑运算
var a="100"&&20 //20 var a=""||20 //20 var a='20'||30 //'20'
有一种方法，可以帮你快速的判读，这个值到底是真还是假
var a=100 console.log(!!a) //true var b='' console.log(!!b) //false
3 winow.onload和DOMContentLoaded的区别
考点：浏览器的渲染过程
4.用JS创建10个a标签，点击的时候弹出对应的序号
考点：作用域
5 简述如何实现一个模块加载器，实现类似require.js的基本功能
考点：JS的模块化
6 实现数组的随机排序
考点：JS数组的算法
7 描述一个new对象的过程
function Foo(name,age){ this.name=name this.age=age this.class='class-1'
// return this
} var f=new Foo('lucy',20)
第一步：
8.写一个原型链继承的例子
function Animal() {
this.eat = function() {
console.log("eat")
}
}
function Dog(name) {
this.bark = function() {
console.log(name)
}
}
Dog.prototype = new Animal
var dog = new Dog("泰迪")
dog.eat() //eat
这个只是一个演示的例子，但是，我们是不推荐这样子写的，这样子去面试，真的不是一个好的选择
我们来做一个绑定DOM操作的例子
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <a id="box"></a> <script type="text/javascript"> function GetEle(elem) { this.elem = document.getElementById(elem) } GetEle.prototype.html=function(html){ if(html){ this.elem.innerHTML=html return this }else{ return this.elem.innerHTML } } GetEle.prototype.on=function(type,fn){ this.elem.addEventListener(type,fn) } var element=new GetEle("box") element.html("<p>点击我</p>").on('click',function(){ console.log("ok") }) </script> </body> </html>
