奔三路 - 你30岁前的学习路!

奔三路学习网

当前位置: 主页 > 前端面试通 > 题库 >

前端面试之银行类,附答案

时间:2020-06-16 09:56来源: 作者:史密斯
北京交通大学2020年毕业,信息技术岗,问的都是比较框架性能、ajax优缺点这种东西,大致内容包括Ajax/jQuery/框架Vue,react。最常见的就是描述一下aiax的过程问了好多次
北京交通大学2020年毕业,信息技术岗,问的都是比较框架性能、ajax优缺点这种东西,大致内容包括Ajax/jQuery/框架Vue,react。最常见的就是描述一下aiax的过程问了好多次


Ajax介绍:

AJAX 是一种在无需重新加载整个网页的情况下,与服务器交互的异步交互的技术。能够更新部分网页的技术。

1 ajax的优点

ü  最大的一点是页面无刷新,在页面内与服务器通信,给用户的体验非常好。

ü  使用异步方式与服务器通信,不需要打断用户的操作,具有更加迅速的响应能力。

ü  可以把以前一些服务器负担的工作转嫁到客户端,利用客户端闲置的能力来处理,减轻服务器和带宽的负担,节约空间和宽带租用成本。并且减轻服务器的负担,ajax的原则是“按需取数据”,可以最大程度的减少冗余请求,和响应对服务器造成的负担。

ü  基于标准化的并被广泛支持的技术,不需要下载插件或者小程序。

2 ajax的缺点

ü  ajax干掉了back按钮,即对浏览器后退机制的破坏。

ü  安全问题  技术同时也对IT企业带来了新的安全威胁,ajax技术就如同对企业数据建立了一个直接通道。这使得开发者在不经意间会暴露比以前更多的数据和服务器逻辑。

ü  对搜索引擎的支持比较弱。

ü  破坏了程序的异常机制。

ü  给我们的调试带来了很大的困难。

3 Ajax请求的步骤

ü  创建`XMLHttpRequest`对象,也就是创建一个异步调用对象;

ü  创建一个新的`HTTP`请求,并指定该`HTTP`请求的方式、`URL`及验证信息;

ü  通过open与服务器建立连接

ü  设置响应`HTTP`请求状态变化的函数;onreadystatechange

ü  发送`HTTP`请求;

ü  获取异步调用返回的数据;

ü  使用Javascript和DOM实现局部刷新。

 

4.readyState状态码

 

0:请求未初始化

1:服务器连接已建立

 

2:请求已接收

3:请求处理中

4:请求已完成,且响应已就绪

 

5.http状态码(status

 

200:(成功)

301:永久重定向

302:临时重定向

401 未授权

403:(禁止)服务器拒绝请求

404:(未找到)服务器找不到请求的页面

408:(请求超时)服务器等候请求发生超时

500:(服务器内部错误)服务器遇到错误,无法完成请求。

 

6.XMLHttpRequest对象

(1)对象类型的API;

(2)在浏览器环境使用;

(3)用于客户端和服务端数据的传递和接收;

(4)用于请求XML数据(JSON/TEXT)。

 

Axios:基于promise对ajax的封装

优点:

ü  简单易用从node.js 创建http 请求

ü  支持Promise API

ü  客户端支持防止CSRF(跨站请求伪造)

ü  提供了一些并发请求的接口(重要,方便了很多的操作)

ü  浏览器兼容性好

jquery ajax

优点:

ü 浏览器兼容性好

ü 是对js中的ajax的封装,可以调用ap,使用较容易

ü 可以很简单的设定beforesend、error、success、complete等回调函数

 

缺点:

ü  本身是针对MVC的编程,不符合现在前端MVVM的浪潮

ü  基于原生的XHR开发,XHR本身的架构不清晰

ü  JQuery整个项目太大,单纯使用ajax却要引入整个JQuery非常的不合理(采取个性化打包的方案又不能享受CDN服务)

 

 

Promise

Promise 是异步编程的一种解决方案,其实是一个构造函数,自己身上有all、reject、resolve这几个方法,原型上有then、catch等方法。

Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。Promise 提供统一的API,各种异步操作都可以用同样的方法进行处理。

Promise对象有以下两个特点:

(1)对象的状态不受外界影响。Promise对象代表一个异步操作,有三种状态:Pending(进行中)、Resolved(已完成,又称Fulfilled)和Rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。这也是Promise这个名字的由来,它的英语意思就是“承诺”,表示其他手段无法改变。

(2)一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise对象的状态改变,只有两种可能:从Pending变为Resolved和从Pending变为Rejected。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果。就算改变已经发生了,你再对Promise对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。

好处:

ü  promise主要解决回调地狱问题

ü  使得原本的多层级的嵌套代码,变成了链式调用

ü  让代码更清晰,减少嵌套数

缺点:

编写的难度比传统写法高,而且阅读代码也不是一眼可以看懂。你只会看到一堆then,必须自己在then的回调函数里面理清逻辑。

 

 

JQuery的特点
优点:

.一款轻量级的js框架。
JQuery核心js文件才几十kb,不会影响页面加载速度。与Extjs相比要轻便的多。
(2).丰富的DOM选择器(CSS1-3 + XPath)
JQuery的选择器用起来很方便,好比要找到某个dom对象的相邻元素js可能要写好几行代码,而JQuery一行代码就搞定了,再比如要将一个表格的隔行变色,JQuery也是一行代码搞定。
(3).链式表达式。
JQuery的链式操作可以把多个操作写在一行代码里,更加简洁。
(4).事件、样式、动画支持。
JQuery还简化了js操作css的代码,并且代码的可读性也比js要强。
(5).Ajax操作支持。
JQuery简化了AJAX操作,后台只需返回一个JSON格式的字符串就能完成与前台的通信。
(6).跨浏览器兼容。
JQuery基本兼容了现在主流的浏览器,不用再为浏览器的兼容问题而伤透脑筋。
(7).插件扩展开发。
JQuery有着丰富的第三方的插件,例如:树形菜单、日期控件、图片切换插件、弹出窗口等等基本前台页面上的组件都有对应插件,并且用JQuery插件做出来的效果很炫,并且可以根据自己需要去改写和封装插件,简单实用。
(8).可扩展性强。
JQuery提供了扩展接口:JQuery.extend(object),可以在JQuery的命名空间上增加新函数。JQuery的所有插件都是基于这个扩展接口开发的。

 

缺点:

(1):不能向后兼容,不能兼容早期版本,早期版本插件不能用。

(2):在同个页面使用多个插件,会出现冲突现象。

(3):jQuery版本稳定性较差,版本更新较快。


vue框架(MVVM)

优点:

·            轻量级框架,语法简单,学习成本低

·            双向数据绑定

·            组件化开发

·            数据和结构的分离

·            虚拟DOM

·            运行速度快

·            灵活渐进式框架

缺点:

·            不支持IE8

·            生态环境差,不如angular和react

·            不适合偏大型的项目


react框架(MVC)

优点:

·            jsx语法创建虚拟DOM,极速的渲染性能

·            组件化开发,组件独立,方便重复使用

·            单向数据流

·            组件生命周期

·            跨浏览器兼容性好

缺点:

·            不适合单独做一个完整的框架

React是目标是UI组件,通常可以和其它框架组合使用,目前并不适合单独做一个完整的框架。React 即使配上Flux 的组合,也不能称之一个完整的框架,比如你想用Promise化的AJAX?对不起没有,自己找现成的库去。而且第三方组件远远不如Angular多。

应用场景:个性化需求、中型应用
 

原型对象:

  每个函数都有prototype(原型)属性,这个属性是一个指针,指向一个对象,这个对象的用途是包含特定类型的所有实例共享的属性和方法,即这个原型对象是用来给实例共享属性和方法的。而每个实例内部都有一个指向原型对象的指针。

 

原型链:

每个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针。当我们访问一个对象的属性时,如果这个对象内部不存在这个属性,那么他就会去prototype里找这个属性,这个prototype又会有自己的prototype,于是就这样一直找下去,也就是我们平时所说的原型链的概念。


(1)prototype:每个构造函数都有一个prototype 属性,指向原型对象。每一个Javascript对象(null除外)在创建的时候就会与之关联另一个对象,这个对象就是我们所说的原型,每一个对象都会从原型"继承"属性。

(2)proto每一个实例对象(除了null )都具有的一个属性,叫proto,这个属性会指向该对象的原型对象。

(3)Constructor:每个原型都有一个constructor 属性指向关联的构造函数 实例原型指向构造函数。如此层层递进,这就构成了实例与原型的链条。这就是原型链的基本概念;

 

闭包的优点:1.能够读取函数内部的变量2.让这些变量一直存在于内存中,不会在调用结束后,被垃圾回收机制回收

 

闭包的缺点:正所谓物极必反,由于闭包会使函数中的变量保存在内存中,内存消耗很大,影响网页性能。

  所以不能滥用闭包,解决办法是,退出函数之前,将不使用的局部变量删除。简单的说就是把那些不需要的变量,但是垃圾回收又收不走的的那些赋值为null,然后让垃圾回收走;


  作用域链:如果在当前作用域中没有查到值,就会向上级作用域去查,直到查到全局作用域,这么一个查找过程形成的链条就叫做作用域链。

 

同步任务和异步任务:

(1)同步任务

    同步任务是指在主线程上排队执行的任务,只有前一个任务执行完毕,才能继续执行下一个任务,当我们打开网站时,网站的渲染过程,比如元素的渲染,其实就是一个同步任务

(2)异步任务

    异步任务是指不进入主线程,而进入任务队列的任务,只有任务队列通知主线程,某个异步任务可以执行了,该任务才会进入主线程,当我们打开网站时,像图片的加载,音乐的加载,其实就是一个异步任务

 

 

闭包

 

闭包:能够读取其他函数内部变量的函数。(应用场景:要获取某函数内部的局部变量)。闭包是就是函数中的函数,里面的函数可以访问外面函数的变量,外面的变量的是这个内部函数的一部分。闭包是将函数内部和函数外部连接起来的桥梁。


作者:快乐小张

(责任编辑:admin)
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片
发布者资料
史密斯 查看详细资料 发送留言 加为好友 用户等级:注册会员 注册时间:2017-11-24 11:11 最后登录:2020-06-16 09:06

奔三路小程序已改版