4399笔试+一面

4399的笔试题也是挺喜欢的，有单选多选编程论述这四种题型，单选和多选既有考前端相关，也有考计算机基础知识，就是题量多了点，时间也挺长的。有30道单选，15道多选，2道编程，6道论述，两个钟

论述题：

1、做过哪些开发，用了什么技术，成果呢

2、同学觉得自己哪方面让人佩服

。。。。。。

编程题：

1、从A页面传值到B页面有哪些方法

答：

1）、可以通过cookie传值，建议不要通过cookie保存数据，因为cookie中的信息会被加入到请求头，并在每次请求发送到服务器，增加网络传输。

http://www.jb51.net/article/44181.htm

//a.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript" src="jquery-1.12.1.min.js"></script>
    <script type="text/javascript" src="jquery.cookie.js"></script> 
    <script type="text/javascript">
    $(function(){
        $.cookie("i","123");
    })
    </script>
</head>
<body>
</body>
</html>

//b.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript" src="jquery-1.12.1.min.js"></script>
    <script type="text/javascript" src="jquery.cookie.js"></script> 
    <script type="text/javascript">
    $(function(){
        var i = $.cookie('i');
        $(".div").html("<p>"+i+"</p>");
    })
        
    </script>
</head>
<body>
    <div class="div"></div>
</body>
</html>

2）、通过localstorage

http://blog.csdn.net/fd214333890/article/details/48809061

//a.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript">
    localStorage.setItem("user","woaini");  
    </script>
</head>
<body>
</body>
</html>

//b.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript">
    var user = localStorage.getItem("user");  
    alert(user);
    </script>
</head>
<body>
</body>
</html>

简答题：

1、CSS3的新特性

答：

选择器盒模型背景和边框文字特效 2D/3D转换动画多列布局用户界面

边框：border-radius box-shadow（4个参数） border-image

背景：background-image background-size background-origin background-clip

渐变：background: linear-gradient(red, blue); /* 标准的语法 */

文本效果：text-shadow box-shadow text-overflow word-wrap word-break

字体：CSS3 @font-face 规则

CSS3 2D 转换：transform

CSS3 3D 转换：

CSS3 过度：transition

CSS3 动画：@keyframes规则

CSS3 多列：column-count column-gap column-rule-style column-rule-width column-rule-color column-rule column-span column-width

。。。。。。

2、cookies、localStorage、sessionStorage的区别

cookies 和＊Storage 的区别：

cookies会在服务器端和客户端间传递的；sessionStorage 和 localStorage存放在客户端的，不会发送至服务器端
cookies的兼容主流浏览器,包括IE6+;IE6，IE7不支持sessionStorage 和 localStorage
sessionStorage 和 localStorage中能存的数据比cookie大

sessionStorage 和 localStorage的区别：

LocalStorage：浏览器关闭了数据仍然可以保存下来，并可用于所有同源（相同的域名、协议和端口）窗口（或标签页）永久存储，永不失效，除非手动删除
sessionStorage：数据存储在窗口对象中，窗口关闭后对应的窗口对象消失，存储的数据也会丢失。就是浏览器窗口关闭就失效了。

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 接口使用更方便。

多选：

6、计算机网络三个组成部分

答：

①若干主机(host)，它可以是各种类型的计算机，用来向用户提供服务；
②一个通信子网，它由一些通信电路和结点交换机组成，用于进行数据通信；
③一系列通信协议，这些协议是为主机与主机、主机与通信子网或通信子网中各结点之间通信用的，协议是通信双方事先约定好的和必须遵守的规则，它是计算机网络不可缺少的部分。

11、跨域的方法

http://www.jianshu.com/p/045e2bc64f2c

1> document.domain + iframe (只有在主域相同的时候才能使用该方法)
2> 动态创建script (因为script标签不受同源策略的限制。)
3> location.hash + iframe
4> window.name + iframe ( window.name 的美妙之处：name 值在不同的页面（甚至不同域名）加载后依旧存在，并且可以支持非常长的 name 值（2MB）。)

5> postMessage（HTML5中的XMLHttpRequest Level 2中的API）

6> CORS( CORS背后的思想，就是使用自定义的HTTP头部让浏览器与服务器进行沟通，从而决定请求或响应是应该成功，还是应该失败。)

7> JSONP
8> web sockets

12、内核

浏览器内核英文名称为“Layout engine”，翻译过来就是“排版引擎”，也被称为“页面渲染引擎”。它负责取得网页的内容（HTML、XML、图像等等）、整理信息（例如加入CSS等），以及计算网页的显示方式，然后会输出至显示器或打印机。

1、使用Trident内核的浏览器：IE、傲游、世界之窗浏览器、Avant、腾讯Netscape 8、GreenBrowser和KKman等；

2、使用Gecko内核的浏览器：Mozilla Firefox、Mozilla SeaMonkey；

3、使用Presto内核的浏览器：Opera7及以上版本；

4、使用Webkit内核的浏览器：Safari、Chrome。

5、一些国内浏览器的内核：

搜狗浏览器：兼容模式（IE：Trident）和高速模式（webkit）

傲游浏览器：兼容模式（IE：Trident）和高速模式（webkit）

QQ浏览器：普通模式（IE：Trident）和极速模式（webkit）

360极速浏览器：基于谷歌（Chromium）和IE内核

360安全浏览器：IE内核

浏览器内核又可以分成两部分：渲染引擎(layout engineer 或者 Rendering Engine)和 JS 引擎。它负责取得网页的内容（HTML、XML、图像等等）、整理讯息（例如加入 CSS 等），以及计算网页的显示方式，然后会输出至显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同，所以渲染的效果也不相同。所有网页浏览器、电子邮件客户端以及其它需要编辑、显示网络内容的应用程序都需要内核。JS 引擎则是解析 Javascript 语言，执行 javascript 语言来实现网页的动态效果。

最开始渲染引擎和 JS 引擎并没有区分的很明确，后来 JS 引擎越来越独立，内核就倾向于只指渲染引擎。有一个网页标准计划小组制作了一个 ACID 来测试引擎的兼容性和性能。内核的种类很多，如加上没什么人使用的非商业的免费内核，可能会有 10 多种，但是常见的浏览器内核可以分这四种：Trident、Gecko、Blink、Webkit。

13、video支持的格式

格式	IE	Firefox	Opera	Chrome	Safari
Ogg	No	3.5+	10.5+	5.0+	No
MPEG 4	9.0+	No	No	5.0+	3.0+
WebM	No	4.0+	10.6+	6.0+	No

Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件

MPEG4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件

WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件

单选题：

2、JS模块化；AMD\CMD规范；common.js

3、

var color = 'green';

var test4399 = {

color:'blue';

getColor:function(){

var color = 'red';

alert(this.color);

}

var getColor = test4399.getColor;

getColor();

test4399.getColor();

4、块级元素

5、hasownproperty

9、json的格式

11、http的状态码

14、阻止事件的默认行为

15、使用MVVC/MVC的框架有哪些

16、Ajax

http://www.cnblogs.com/mingmingruyuedlut/archive/2011/10/18/2216553.html

18、jQuery的方法中，使用事件委托的是：（我选了on）

19、标准的事件模型

22、jQuery方法中，用于跨域的是

27、CSS中的BFC

一面

1、非HTML5的缓存有哪些

HTML5的缓存：

一.离线存储
有一个web应用有三个文件index.html,a.js,b.css，现在需要把js和css文件缓存起来
   1.在index.html里加上<html manifest="test.manifest">
   2.manifest清单格式如下
CACHE MANIFEST
#上面一句必须
#v1.0.0
#需要缓存的文件
CACHE:
a.js
b.css
#不需要缓存的文件
NETWORK:
*
#无法访问页面
FALLBACK:
404.html
   3.manifest文件的mime-type必须是 text/cache-manifest类型
   注意点：
   　　1.对于每个index.html?id=1或index.html?id=2都会分别缓存index.html页面，可以通过chrome浏览器Resources/Application Cache观察
   　　2.如果想更新缓存内容，只要修改下manifest文件即可，如改版本号v1.0.1
　4.离线存储如果资源有更新，可以通过如下代码来监听，但第一次加载还会是原来的版本
window.applicationCache.addEventListener('updateready',function(e){
    if(window.applicationCache.status == window.applicationCache.UPDATEREADY){
        window.applicationCache.swapCache();
        
        if(confirm("loding new?")){
            window.location.reload()
        }
    }
},false)    
二.本地缓存
localStorage.setItem("key","value")
localStorage.getItem("key","value")
localStorage.removeItem("key")
localStorage.clear()

其他：http://www.kuqin.com/shuoit/20160106/349837.html

一、http缓存
http缓存是基于HTTP协议的浏览器文件级缓存机制。
二、websql
websql这种方式只有较新的chrome浏览器支持，并以一个独立规范形式出现
三、indexDB
IndexedDB 是一个为了能够在客户端存储可观数量的结构化数据，并且在这些数据上使用索引进行高性能检索的 API。
四、cookie
Cookie（或者Cookies），指一般网站为了辨别用户身份、进行session跟踪而储存在用户本地终端上的数据（通常经过加密）。
五、localstorage
localStorage是html5的一种新的本地缓存方案，目前用的比较多，一般用来存储ajax返回的数据，加快下次页面打开时的渲染速度。
六、sessionstorage
sessionStorage和localstorage类似，但是浏览器关闭则会全部删除，api和localstorage相同，实际项目中使用较少。
七、application cache
application cahce是将大部分图片资源、js、css等静态资源放在manifest文件配置中。
八、cacheStorage
CacheStorage是在ServiceWorker的规范中定义的。
九、flash缓存
这种方式基本不用，这一方法主要基于flash有读写浏览器端本地目录的功能，同时也可以向js提供调用的api

2、JS的重定向有哪些

在现行的网站应用中URL重定向的应用有很多：

404页面处理、网址改变（t.sina转到weibo.com）、多个网站地址（如：http://www.google.com/ 、www.g.cn ）等；

本质上就是将当前使用者的网址从一个网址导向到另外的一个网址上面去；

实现重定向的方式有很多种，有服务器端配置、后端程序重定向处理、前端js重定向；

先来说下前端从定向的实现：在众多的BOM对象中，location算是最重要的对象之一了，使用location可以通过多种方式来改变浏览器的位置，

location.assign("http://www.baidu.com");

window.location="http://www.baidu.com";

location.href="http://www.baidu.com";

self.location="http://www.baidu.com";

window.location.href="http://www.baidu.com";

top.location="http://www.baidu.com";

3、哪些能力比同行人强

4、UC上的网站获得的数据与我们获得的数据不一样，有哪些原因

问:百度DataAPI拿到的数据和百度统计后台看到的数据不一样，这是为什么？


数据不一样是正常的，即便是做百度SEM推广所看到的访问量和百度统计也有出入
这是因为统计的机制不一样，百度统计是利用安装的网页上的JS代码实现每个访客的信息记录，所以数据只能做参考。举个例子，如果你吧百度统计代码装在网页底部，当有访客点击打开网站时，网页只加载了一半，访客就关闭了网页，百度统计就记录不到这次访问。而其他统计工具不存在这个问题，所以可以正常记录。一般大型网站的UV是很大的，也就必不可免的出现这种情况。

当然，如果为了记录有效访客，还是建议把百度统计代码装在网页底部，因为加载一半就走的访客可以认定为是无效访问，访客并没有浏览完整内容，也就没有统计的意义。

另外，不同统计工具在数据统计汇总上也会有自己的过滤机制，自动过滤掉它认为是无效的访问，数据呈现也有延迟，比如百度推广的后台数据一般认为最慢是半小时以前的数据，最快是5分钟之前的，而非实时。

再者，针对你的这组数据，UV需要着重说明一下，百度统计定义的UV是，半小时以内，该访客无论打开网站多少次，均计一个UV，超过半小时打开，或刷新页面则计两个，其他统计工具则可能有自己的标准！

5、一个网站对的响应速度慢有哪些原因

1、网站主机的速度慢
2、网站代码的繁琐
3、网站用了大量的JS调用
4、网站图片太大
5、flash
有很多的网站，为了能让自己的网站看起来更美观一些，所以在网站中添加flash文件，让网站的核心内容能以flash的方式为用户播放出来，其实，如果你是第一次访问这个页面，浏览器里没有这个页面的缓存，你会发现flash内容是需要加载的，并且flash内容并不是很稳定，如果用户的网速不是很好，或者你的空间不稳定，就会出现flash加载失败的现象，很影响用户体验。

posted @ 2016-09-27 23:54 chenxj 阅读(1017) 评论(0) 收藏举报

刷新页面返回顶部

chenxj

走在前端路上。。。。。。

4399笔试+一面

公告