前端面试题总结一(js基础题)

一 、window.onload和$(document).ready(function(){})的区别

1、执行时间上的区别：window.onload必须等到页面内（包括图片的）所有元素加载到浏览器中后才能执行。而$(document).ready(function(){})是DOM结构加载完毕后就会执行。

2、编写个数不同：window.onload不能同时写多个，如果有多个window.onload，则只有最后一个会执行，它会把前面的都覆盖掉。$(document).ready(function(){})则不同，它可以编写多个，并且每一个都会执行。

3、简写方法：window.onload没有简写的方法，$(document).ready(function(){})可以简写为$(function(){})。

另外：由于在$(document).ready()方法内注册的事件，只要DOM就绪就会被执行，因此可能此时元素的关联文件未下载完，例如与图片有关的HTML下载完毕，并且已经解析为DOM树了，但很有可能图片还未加载完毕，所以例如图片的高度和宽度这样的属性此时不一定有效。

要解决这个问题，可以使用JQuery中另一个关于页面加载的方法---load（）方法。load（）方法会在元素的onload事件中绑定一个处理函数。如果处理函数绑定在元素上，则会在元素的内容加载完毕后触发。如：$(window).load(function(){})=====window.onload = function(){}

二js判断类型

1、typeof

 typeof有两种写法：typeof   xxx   ,typeof(xxx)

  如：

       typeof   2      输出   number
       typeof   null   输出   object

       typeof   {}    输出   object

       typeof    []    输出   object

       typeof   (function(){})   输出  function

       typeof    undefined         输出  undefined

       typeof   '222'                 输出    string

      typeof  true                   输出     boolean

 注意：

（1）判断字符串时要加上双引号

（2）这里面包含了js里面的五种数据类型  number   string    boolean   undefined     object和函数类  型 function，但是并不能区分 null， {}  ，[]  这三种，那么可以用第2种方式

 2、Object.prototype.toString.call

 这是对象的一个原生原型扩展函数,用来更精确的区分数据类型。

 如：

 var   gettype=Object.prototype.toString

        gettype.call('aaaa')        输出      [object String]

        gettype.call(2222)         输出      [object Number]

        gettype.call(true)          输出      [object Boolean]

        gettype.call(undefined)  输出      [object Undefined]

        gettype.call(null)                  输出   [object Null]

         gettype.call({})                   输出   [object Object]

         gettype.call([])                    输出   [object Array]
         gettype.call(function(){})     输出   [object Function]

 注意：

 大小写不能写错，虽然比较繁琐，但是通用

3、constructor断数据类型：

  如:

 '12312'.constructor==String     输出 true

 [].constructor==Array              输出 true

 var obj= new Object()              
 obj.constructor==Object           输出 true

注意：

constructor 在继承时会出错

如：

function A(){};     
function B(){};     
A.prototype = new B(); //A继承自B      
var C = new A();     
console.log(C.constructor === B)   输出 true
console.log(C.constructor === A)  输出 false
//而instanceof方法不会出现该问题，对象直接继承和间接继承的都会报true   
console.log(C instanceof A)  输出 true
console.log(C instanceof B)  输出 true

4、instanceof

 判断已知对象类型的方法

如:
[1,2] instanceof Array                输出 true

new Date() instanceof Date        输出 true

function f(){
  console.log('我是函数')
}
f instanceof Function

 注意：

instanceof后面一定要是对象类型，并且大小写不能错，该方法适合条件选择,如何不熟悉对象类型的可以点击这里

5、jquery.type()

万能的，但是不常用，这里就不做介绍了,参考地址 点击这里

通常我们就用typeof就可以满足需求判断了，如果遇到object类型可以选择instanceof或者constructor