网易金融前端实习生电话面试整理

大厂前端面试考什么? | 掘金技术征文php

前端面试题总结——综合问题css

1.CSS做用

CSS:层叠样式表单,渲染HTML元素标签的样式。经过使用CSS样式设计页面的格式,可将页面的内容与表现形式分离。不只可以使维护站点的外观更加容易,并且还可使HTML文档代码更加简练,缩短浏览器的加载时间。html

2.CSS3动画

CSS动画简介前端

animation:

@keyframes规则用于建立动画,在 @keyframes 中规定CSS 样式,就能建立由当前样式逐渐改成新样式的动画效果。es6

在 @keyframes 中建立动画时,请把它捆绑到某个选择器,不然不会产生动画效果。web

经过规定至少如下两项 CSS3 动画属性,便可将动画绑定到选择器:面试

  • 规定动画的名称 animation-name
  • 规定动画的时长 animation-duration

用百分比来规定变化发生的时间,或用关键词 "from" 和 "to",等同于 0% 和 100%。ajax

0% 是动画的开始,100% 是动画的完成。json

属性 描述
@keyframes 规定动画。
animation 全部动画属性的简写属性,除了 animation-play-state 属性。
animation-name 规定 @keyframes 动画的名称。
animation-duration 规定动画完成一个周期所花费的秒或毫秒。默认是 0。
animation-timing-function 规定动画的速度曲线。默认是 "ease"。
animation-delay 规定动画什么时候开始。默认是 0。
animation-iteration-count 规定动画被播放的次数。默认是 1。
animation-direction 规定动画是否在下一周期逆向地播放。默认是 "normal"。
animation-play-state 规定动画是否正在运行或暂停。默认是 "running"。
animation-fill-mode 规定对象动画时间以外的状态。

CSS的transition和animation有何区别

transition和animation均可以做动效。跨域

transition

是过渡,由一个状态过渡到另外一个状态,好比高度100px过渡到200px;transition的做用在于,指定状态变化所须要的时间。

(1)transition须要事件触发,因此无法在网页加载时自动发生。

(2)transition是一次性的,不能重复发生,除非一再触发。

(3)transition只能定义开始状态和结束状态,不能定义中间状态,也就是说只有两个状态。

(4)一条transition规则,只能定义一个属性的变化,不能涉及多个属性。

animation

是动画,animation有帧的概念,能够设置关键帧keyframe,一个动画能够由多个状态过渡组成。

3.选择器权重及优先级 

权重分为四级,权重值越大优先级越高。

1.内联样式。如:style=“xxx”,权值为1000

2.ID选择器。如:#content,权值为100

3.类,伪类和属性选择器。如:.content,:hover,[attribute],权值为10

4.元素选择器,伪元素选择器。如:div,p,权值为1

注意:通用选择器(*),子选择器(>),相邻同胞选择器(+)并不在四个等级中,权值为0

权重值越大优先级越高,相同权值后定义覆盖前面定义的

!important  强制重定义,提高优先级。

不要用标签名限制 class 规则,如div.info这样的写法,其实咱们能够直接写为.info,从右到左解析的缘由能够知道为何其低效。

4.JQuery机制 

前端知识点总结——JQ(上)

前端知识点总结——JQ(下)

5.AJAX

经过在后台与服务器进行少许数据交换,AJAX 可使网页实现异步更新。AJAX是一种在无需从新加载整个网页的状况下,可以更新部分网页的状况。

1.建立一个ajax对象,var ajax = new XMLHttpRequest();

2.链接服务器,ajax.open(method,url,true );   异步传输(多个事情一块儿作)

3.发送请求,ajax.send( );

4.接受返回,处理数据。

readystate(浏览器服务器进行到哪一步了)

0:(未初始化)未调用open方法

1:(载入)已调用send方法,正在发送求情

2:(载入完成)send完成

3:(解析)正在解析响应内容

4:(完成)响应内容解析完成

status HTTP状态码

200:成功

301:永久重定向

302:临时重定向

304:资源找到,但不符合条件

404:找不到资源

500:服务器端出错

6.HTTP协议 

HTTP协议详解

HTTP协议是超文本传输协议

HTTP是一个基于TCP/IP通讯协议来传递数据(HTML 文件, 图片文件, 查询结果等)。

HTTP协议工做于客户端-服务端架构为上。浏览器做为HTTP客户端经过URL向HTTP服务端即WEB服务器发送全部请求。Web服务器根据接收到的请求后,向客户端发送响应信息。

1.输入地址

2.浏览器经过DNS服务器查找域名的IP地址(DNS查找过程:浏览器缓存->系统缓存->路由器缓存)

3.浏览器向web服务器发送一个HTTP请求

4.服务器永久重定向响应(从http://example.com到http://www.example.com)

5.浏览器跟踪重定向地址

6.服务器处理请求

7.服务返回一个HTTP响应

8.浏览器显示HTML

9.浏览器发送请求获取嵌在HTML中的资源(如图片,音频,视频,css,js等)

10.浏览器发送异步请求


 7.原型 

JS进阶(1) —— 人人都能懂的构造函数

JS进阶(2):人人都能懂的原型对象

 8.闭包

 9.Promise  

es6—Promise

10.回调机制  

JS—回调函数

11.ES6 Class 继承 与原生JS继承区别

小谈ES6中的class与继承

在ES5中,继承实质上是子类先建立属于本身的this,而后再将父类的方法添加到this(也就是使用Parent.apply(this)的方式)或者this.__proto__(即Child.prototype=new Parent())上。

而在ES6中,则是先建立父类的实例对象this,而后再用子类的构造函数修改this

12.跨域

容许跨域请求: link, img, script
不容许跨域: xhr对象 (ajax请求)
变通: script 须要服务器返回一段可执行的js语句

服务器应该返回包含数据的一条可执行的js语句复制代码

如何实现?
客户端实现: JSONP (填充式json)

1. 在客户端定义处理函数

2. 在按钮单击事件中,动态建立script元素,src设置为服务端地址,并携带请求参数callback=函数名(jsonp不支持POST请求,由于script只支持get请求)

3. 在服务器端,接收请求参数中的函数名,将函数名和要返回的数据,拼接为一条可执行的js语句

4. 客户端script,请求服务端php,得到可执行语句,自动调用提早定义好的函数处理数据

5. 在客户端处理函数结尾,要动态删除script

服务器端代理:添加http请求头

CORS

相关文章
相关标签/搜索