前端面试(二)

web前端综合问题

1. 讲讲输完网址按下回车,到看到网页这个过程中发生了什么?

  • 域名解析
  • 发起TCP的3次握手
  • 建立TCP连接后发起http请求
  • 服务器端相应http请求,浏览器得到html代码
  • 浏览器解析html代码,并请求html代码中的资源
  • 浏览器对页面进行渲染呈现给用户

2. 谈谈你对前端性能优化的理解

  • 请求数量: 合并脚本和样式表,CSS Sprites,拆分初始化负载,划分主域
  • 请求带宽: 开启GZip,精简JavaScript,移除重复脚本,图像优化,将icon做成字体
  • 缓存利用: 使用CDN,使用外部JavaScript和CSS,添加Expires头,减少DNS查找,配置ETag,使Ajax可缓存
  • 页面结构: 将样式放在顶部,将脚本放在底部,尽早刷新文档的输出
  • 代码校验: 避免css表达式,避免重定向

    阅读全文 »

前端面试(一)

前端面试题–HTML

1. 浏览器的本地存储

在HTML5中提供了sessionStoragelocalStorage两种浏览器的本地存储方式。
sessionStorage用于在本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且会话结束之后数据也随之销毁,是会话级别的存储。
localStorage用于持久化的本地存储,除非主动删除数据,否则数据是不会过期的。

2. web storeage和cookie的区别

  • cookie的大小是受限制的(大概4K左右)
  • 每次请求一个新的页面的时候Cookie都会被发送过去,这样无形中浪费了带宽
  • cookie需要指定作用域,不可以跨域调用
  • web stroage拥有setltemgetltem等方法,cookie需要前端开发者自己封装setCookie,getCookie
  • cookie的作用是与服务器进行交互,作为HTTP规范的一部分而存在,而WebStroage津津是为了在本地“存储”数据而生
  • IE6,7中的UserData通过简单的代码封装可以统一到所有的浏览器都支持web stroage

    阅读全文 »

LESS学习笔记

本文讲述less的使用语法

  • 关于注释
    1.less的注释跟js一样,不会被编译。
    2.有两种方法: //这是单行注释; /*这是多行注释,也是css的注释*/
    3.注意:如果使用css的注释,那么编译的时候,这个注释会被保留

    阅读全文 »

Jquery的ajax方法学习

Jquery里面的get方法

1
2
3
4
5
6
7
$.get('01.jq_get.php',{name:"jack",age:18},function (data) {
// 直接打印结果
console.log(data);
// 打印属性值
console.log(data.name);
console.log(data.color);
},'json');

  • 参数1:url
  • 参数2:发送的数据,支持直接写js对象,字面量对象,可选参数
  • 参数3:回调函数
  • 参数4:从服务端获取的数据类型,可选参数,如果写为json,jq内部会帮我们进行一个JSON.parse()的转化,不写的话,需要手动转化

    阅读全文 »

关于自增(自减)运算的一点问题

问题的引出

先来看一段代码

1
2
3
4
var a = 1;
var b = ++a + ++a;
console.log(a); // 3
console.log(b); //5

分析:这里a的计算过程很简单,第一个a是前置自增,所以一开始参与运算就自己变成2,后面一个a也是一样,但是第二个a的值自增之前已经是2了,所以自增之后就是3,那么赋值给b就是2+3=5了;而a的最终值是最后一次自增后的3.

阅读全文 »