2018.3.21前端常见面试题

1.

(function(){
    var a=b=1;
    console.log(a);
})()
console.log(a,b);
VM187:3 1
VM187:5 Uncaught ReferenceError: a is not defined
    at <anonymous>:5:13

注释:console.log(a);输出1,
a局部作用域,b没有声明(为全局作用域)
2

var car=null;
var bar;
console.log(car==bar)
VM528:3 true

3.在本地存储数组

var arra=[1,2,3,4];
localStorage.setItem('key',JSON.stringify(arra));
var read=JSON.parse(localStorage.getItem('key'));
console.log(read,read.length);

4判断一个对象是否是数组
第一种方法:
语法: A instanceof B,意思是对象A的原型是否是B.prototype。如果是,返回true,如果不是,返回false。

 var a={};
  var b=[];
  console.log(a instanceof Object);//true
  console.log(b instanceof Array);//true

使用instanceof操作符有一个问题就是,它假定只有一个全局作用域。如果一个网页中有多个框架(iframe元素),那实际上就存在两个以上不同的全局执行环境,从而存在两个以上不同版本的Array构造函数。如果你从一个框架向另一个框架传入一个数组,那么传入的数组与在第二个框架中原生创建的数组分别具有各自不同的构造函数。传入的数组在该框架中用instanceof操作符判断就会返回false。代码如下:

var a={};
  var b=[];
  console.log(a instanceof Object);//true
  console.log(b instanceof Array);//true

  var frame=document.createElement("iframe");//创建一个框架
  document.body.appendChild(frame);
  var c=window.frames[0].Array;//取得框架全局执行环境中的Array构造函数
  var d=new c();//在框架全局执行环境中创建一个数组d
  console.log(d instanceof Array);//在当前页面的执行环境中用instanceof操作符判断d是否为数组,返回false
  console.log(Array.isArray(d));//true

第二种方法:

使用ECMAScript 5新增的Array.isArray()方法。这个方法的作用就是确定某个值到底是不是数组,而不管它到底是在哪个全局执行环境中创建的。

第三种方法:

使用使用Object.prototype上的原生toString()方法判断。

使用方法如下:

Object.prototype.toString.call(value)
该方法返回一个[object NativeConstructorName]格式的字符串。每个类在内部都有一个[[Class]]属性,这个属性中就指定了上述字符串中的构造函数名。
该方法不能检测非原生构造函数的函数名,因此开发人员定义的任何构造函数都将返回[object Object]。

var a={};
  var b=[];
  var frame=document.createElement("iframe");//创建一个框架
  document.body.appendChild(frame);
  var c=window.frames[0].Array;//取得框架全局执行环境中的Array构造函数
  var d=new c();//在框架全局执行环境中创建一个数组d
  console.log(Object.prototype.toString.call(a));//[object Object]
  console.log(Object.prototype.toString.call(b));//[object Array]
  console.log(Object.prototype.toString.call(d));//[object Array]

  function Person() {
     this.name=name;
  }
  var n=new Person();
  console.log(Object.prototype.toString.call(n));//[object Object]

5.什么是闭包,为什么要使用它
闭包(closure)是javascript的一大难点,也是它的特色。很多高级应用都要依靠闭包来实现。闭包是个桥梁。
我们在函数外是访问不了函数内的局部变量!正常的情况下我们是办不到的


<script>
   function num(){
    //用var声明一个变量num1
     var num1 = 15;
     return function(){
         return num1;
    }
  }
 var num2 = num();
 var num3 = num2();
 console.log(num3);//15

  }
</script>

6.常见的跨域方式,优缺点是什么
1:图像ping

图像ping是与服务器进行简单,单项的跨域通信的一种方式
var img=new Image();
img.onload=img.onerror=function(){
alert(“done”)
}
img.src=”http://www.example.com/test?name=sl”;

2:jsonp(最实用) jsonp是通过动态

function callbackFunction(){
   alert("回滚");
}
var script=document.createElement("script");
script.src="http://frergeoip.net.json/?callback=callbackFunction";
document.body.insertBefore(script,document.body.firstChild);

3:使用jquery实现跨域(最简单的)

<script> $.getJSON("http://example.com/data.php?callback=?",function(jsondata){ //回调事件 }); </script> 

只不过我们不需要手动的插入script标签以及定义回掉函数。
jquery会自动生成一个全局函数来替换callback=?中的问号,之后获取到数据后又会自动销毁,实际上就是起一个临时代理函数的作用。
$.getJSON方法会自动判断是否跨域,不跨域的话,就调用普通的ajax方法;跨域的话,则会以异步加载js文件的形式来调用jsonp的回调函数。

4:通过修改document.domain来跨子域

在页面 http://www.example.com/a.html 中设置document.domain:
<iframe src="http://example.com/b.html"  id="iframe"  onload="test()"></iframe>
<script>
   document.domain="example.com";   //设置成他们的父域
   function test(){ 
      document.getElementById("iframe").contentWindow;
   }
</script>

不过如果你想在http://www.example.com/a.html 页面中通过ajax直接请求http://example.com/b.html 页面,即使你设置了相同的document.domain也还是不行的,

所以修改document.domain的方法只适用于不同子域的框架间的交互。
如果你想通过ajax的方法去与不同子域的页面交互,除了使用jsonp的方法外,还可以用一个隐藏的iframe来做一个代理。原理就是让这个iframe载入一个与你想要通过ajax获取数据的目标页面处在相同的域的页面,所以这个iframe中的页面是可以正常使用ajax去获取你要的数据的,然后就是通过我们刚刚讲得修改document.domain的方法,让我们能通过js完全控制这个iframe,这样我们就可以让iframe去发送ajax请求,然后收到的数据我们也可以获得了。

5:使用window.name来进行跨域

window对象有个name属性,该属性有个特征:即在一个窗口(window)的生命周期内,窗口载入的所有的页面都是共享一个window.name的,个页面对window.name都有读写的权限,window.name是持久存在一个窗口载入过的所有页面中的,并不会因新页面的载入而进行重置。
在a.html页面

在a.html页面

在b.html页面

使用window.name来获取b页面想要的值

猜你喜欢

转载自blog.csdn.net/qq_29132907/article/details/79640790