首页 > Web开发 > 详细

js面试题

时间:2017-03-02 13:12:21      阅读:280      评论:0      收藏:0      [点我收藏+]

1.inline 和 block 元素分别有哪些?区别是什么?

inline:内联元素,

a span strong em input select label img br teatarea

block:块状元素

p div ol li br

区别:

内联元素:

     1.设置width和height无效

     2.不能单独占一行,元素不会独占一行,其宽度随元素的内容而变化

     3.padding和margin属性,padding-top,padding-bottom,margin-top,margin-bottom不产生边距,padding-left,padding-right,margin-left,margin-right产生边距

块状元素:1.可以设置width和height

     2.单独占一行

     3. 元素不会独占一行,其宽度随元素的内容而变化

2.请解释 relative、fixed、absolute 和 static 元素的区别

fixed:相对定位,相对于浏览器定位

static:静态定位,默认,不定位,存在文本流中

absolute:绝对定位,相对于除了fixed的第一个父元素定位,脱离文本流中,在文本流中不存在位置

relaticve:相对定位, 脱离文本流,在文本流中存在位置

3.清除浮动方法

  1.clear

  clear:{clear:both;}

  2.伪元素  :after

  clearfix:after:{display:block;conteng:"";clear:both},兼容IE,.clearfix{zoom:1}

  3.给父元素加高

  4.overflow:hidden

4.请描述 cookies、sessionStorage 和 localStorage 的区别 

共同点:都是保存在浏览器端,且同源的。

区别:

  1. cookie数据始终在同源的http请求中携带(即使不需要),即cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存。cookie数据还有路径(path)的概念,可以限制cookie只属于某个路径下。
  2. 存储大小限制也不同,cookie数据不能超过4k,同时因为每次http请求都会携带cookie,所以cookie只适合保存很小的数据,如会话标识。sessionStorage和localStorage 虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大。
  3. 数据有效期不同,sessionStorage:仅在当前浏览器窗口关闭前有效,自然也就不可能持久保持;localStorage:始终有效,窗口或浏览器关闭也一直保存,因此用作持久数据;cookie只在设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭。
  4. 作用域不同,sessionStorage不在不同的浏览器窗口中共享,即使是同一个页面;localStorage 在所有同源窗口中都是共享的;cookie也是在所有同源窗口中都是共享的。
  5. Web Storage 支持事件通知机制,可以将数据更新的通知发送给监听者。
  6. Web Storage 的 api 接口使用更方便。

好处

  1. 快速显示数据:性能好,从本地读数据比通过网络从服务器获得数据快得多,本地数据可以即时获得。再加上网页本身也可以有缓存,因此整个页面和数据都在本地的话,可以立即显示。
  2. 临时存储:很多时候数据只需要在用户浏览一组页面期间使用,关闭窗口后数据就可以丢弃了,这种情况使用sessionStorage非常方便。
  3. 减少网络流量:一旦数据保存在本地后,就可以避免再向服务器请求数据,因此减少不必要的数据请求,减少数据在浏览器和服务器间不必要地来回传递。

5.

下面代码的输出是什么?

console.log(‘one‘);

setTimeout(function() {

  console.log(‘two‘);

}, 0);

console.log(‘three‘);

//one
//three
/ two

6..call 和 .apply 的区别是什么

call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。 
如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。 

apply方法: 
语法:apply(thisObj,[argArray])
定义:应用某一对象的一个方法,用另一个对象替换当前对象。 
说明: 
如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。 
如果没有提供 argArray 和 thisObj 任何一个参数,那么 Global 对象将被用作 thisObj, 并且无法被传递任何参数。

7.如何判断一个对象是否是Array类型

1.通过toString()方法,数组原型和对象原型定义的toString()方法不同

var arr = [1, 2, 3];

        var obj = {

            name: ‘lyl‘,

            age: 18,

            1: ‘name‘

        }

        console.log(Object.prototype.toString.call(arr) === ‘[object Array]‘); //true

        console.log(Object.prototype.toString.call(boj) === ‘[object Array]‘); //false

2.通过instanceof来判断区分

 

 var arr = [1, 2, 3];

        var obj = {

            name: ‘lyl‘,

            age: 18,

            1: ‘name‘

        }

        console.log(arr instanceof Array); //true

        console.log(obj instanceof Array); //false

 

3.通过length属性:

8.如何优化触发频率非常高的事件函数 例如onscroll, oninput 

http://www.qdfuns.com/notes/24933/53e06974b608ea30691fba9d8295fabb.html

9.如何克隆一个数组 

第一种:用ary.slice(0)

var ary = [1,2,3];//源数组

var ary2 = ary.slice(0);//克隆一个新数组

console.log(ary2); 

 

第二种:push

var cc=[1,3,2]

var a=[]

for(var i=0;i<cc.length;i++){

a.push(cc[i])

}

第三种
var newJson = json.concat();

10.javascript,es5,es6的区别

11.bootsrtap的优点

12.html5优点

13.flex布局优点,

 

 

js面试题

原文:http://www.cnblogs.com/summerXll/p/6489829.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!