首页 > 编程知识 正文

web前端面试题及答案,web前端开发面试题及参考答案

时间:2023-05-05 19:31:56 阅读:226589 作者:1553

一、什么是MVVM?

答:

       MVVM是Model-View-ViewModel的简写。它本质上就是MVC 的改进版。

       M是逻辑方法加上数据,V就是用户看到的界面,VM就是逻辑方法加上界面渲染的代码。

二、说说MVVM的优点

答:

低耦合:视图(View)可以独立于Model变化和修改,一个ViewModel可以绑定到不同的"View"上,当View变化的时候Model可以不变,当Model变化的时候View也可以不变。可重用性:你可以把一些视图逻辑放在一个ViewModel里面,让很多view重用这段视图逻辑。独立开发:开发人员可以专注于业务逻辑和数据的开发(ViewModel),设计人员可以专注于页面设计,使用Expression Blend可以很容易设计界面并生成xaml代码。可测试:界面素来是比较难于测试的,测试可以针对ViewModel来写。

三、Vue的双向数据绑定原理是什么?

答:

        使用 ES5 提供的 Object.defineProperty() 方法,监控对数据的操作,从而可以自动触发数据同步。并且,由于是在不同的数据上触发同步,可以精确的将变更发送给绑定的视图,数据变化更新视图,视图变化更新数据。

四、Vue中key值的作用?

答:    

        key的作用主要是为了高效的更新虚拟DOM,另外Vue在使用相同标签名元素的过渡切换时,也会使用到key属性,其目的也是为了vue可以区分它们。

五、JavaScript的基本规范有哪些?

答:

        1.不要在同一行声明多个变量;

        2.使用===或==来比较true和false或者数值;

        3.使用对象字面量代替new Array这种形式;

        4.不要使用全局函数;

        5.switch语句必须使用default分支;

        6.函数不应该有时候有返回值有时候没有返回值;

        7.If语句必须使用大括号;

        8.for-in循环中的变量,用var关键字说明作用域,防止变量污染;

        9.变量的声明遵循驼峰命名法,用let替代var,声明构造函数时首字母大写,定义常量的时候             尽量用大写字母,用_分割;

        10. 变量名不能以数字开头,保留字不能用作变量名;

六、说说栈和堆的区别

答:

栈(stack)和堆(heap)

Stack为自动分配的内存空间,它由系统自动释放;

Heap则是动态分配的内存,大小不定也不会自动释放;

基本类型和引用类型

**基本类型:**存放在栈中的简单数据段,数据大小确定,内存空间大小可以分配。 5种基本数据类型:undefined、null、boolean、number和string,他们是直接按值存放的,所以可以直接访问。

**引用类型:**存放在堆内存中的对象,变量实际保存的是一个指针,这个指针指向另一个位置。每个空间大小不一样,要根据情况进行特定的分配。

当我们需要引用类型(如对象,数组,函数等)的值时,首先从栈中获得该对象的地址指针,然后再从堆内存中取得所需的数据。

栈(stack)和堆(heap)

基本类型与引用类型最大的区别是传值与传址的区别。

七、JavaScript实现继承的几种方式

答:

        1.原型链继承;

        2.组合继承;

        3.借用构造函数继承;

        4.寄生式继承;

        5.组合寄生继承

八、JavaScript作用域链

答:

        在当前的作用域中没有定义 a(可对比一下 b)。当前作用域没有定义的变量,这成为 自由变量 。自由变量的值如何得到 —— 向父级作用域寻找,如果父级也没呢?再一层一层向上寻找,直到找到全局作用域还是没找到,就宣布放弃。这种一层一层的关系,就是 作用域链 。

九、Vue和react的区别有哪些?

答:

数据是不是可变的通过js操作一切还是各自的处理方式类式的组件写法还是声明式的写法什么功能内置,什么交给社区去做

react整体的思路就是函数式,所以推崇纯组件,数据不可变,单向数据流,当然需要双向的地方也可以做到,比如结合redux-form,而vue是基于可变数据的,支持双向绑定。react组件的扩展一般是通过高阶组件,而vue组件会使用mixin。vue内置了很多功能,而react做的很少,很多都是由社区来完成的,vue追求的是开发的简单,而react更在乎方式是否正确。

十、为什么利用多个域名来存储网站资源更有效?

答:

        1.CDN缓存更方便;

        2.突破浏览器并发限制;

        3.节约cookie带宽;

        4.减少主域名连接数,优化页面响应速度;

        5减少不必要的安全问题;

十一、多了个X的XHTML与HTML有什么不一样?

答:

XHTML 元素必须被正确地嵌套。XHTML 元素必须被关闭。标签名必须用小写字母。XHTML 文档必须拥有根元素。属性名称必须小写,属性必须加引号;

十二、浏览器从输入网址到页面渲染全过程 

答:

        1.获取IP地址(通过DNS将URL解析成IP地址);

        2.TCP/IP三次握手建立连接(浏览器利用TCP协议通过三次握手与服务器建立连接);

        3.浏览器向web服务器发送HTTP请求(浏览器通过解析到的IP地址和端口号发起HTTP请                求);

        4.浏览器渲染(浏览器拿到HTML文件后,根据渲染规则进行渲染);

        5.四次挥手断开连接(客户端没有数据发送时就需要断开连接,以释放服务器资源);

十三、三次握手和四次挥手的过程

答:

        三次握手:

                        刚开始客户端处于 closed 的状态,服务端处于 listen 状态

                        1、第一次握手:客户端给服务端发一个 SYN 报文,并指明客户端的初始化序列号                         ISN(c)。此时客户端处于 SYN_Send 状态。

                        2、第二次握手:服务器收到客户端的 SYN 报文之后,会以自己的 SYN 报文作为                         应答,并且也是指定了自己的初始化序列号 ISN(s),同时会把客户端的 ISN + 1 作                         为 ACK 的值,表示自己已经收到了客户端的 SYN,此时服务器处于 SYN_REVD                           的状态。

                        3、第三次握手:客户端收到 SYN 报文之后,会发送一个 ACK 报文,当然,也是                         一样把服务器的 ISN + 1 作为 ACK 的值,表示已经收到了服务端的 SYN 报文,此                         时客户端处于 establised 状态。

                        4、服务器收到 ACK 报文之后,也处于 establised 状态,此时,双方以建立起了链接。

        四次挥手:

                        刚开始双方都处于 establised 状态,假如是客户端先发起关闭请求

                        1、第一次挥手:客户端发送一个 FIN 报文,报文中会指定一个序列号。此时客户                          端处于FIN_WAIT1状态。

                        2、第二次握手:服务端收到 FIN 之后,会发送 ACK 报文,且把客户端的序列号值                         + 1 作为 ACK 报文的序列号值,表明已经收到客户端的报文了,此时服务端处于                         CLOSE_WAIT状态。

                        3、第三次挥手:如果服务端也想断开连接了,和客户端的第一次挥手一样,发给                         FIN 报文,且指定一个序列号。此时服务端处于 LAST_ACK 的状态。

                        4、第四次挥手:客户端收到 FIN 之后,一样发送一个 ACK 报文作为应答,且把                            服务端的序列号值 + 1 作为自己 ACK 报文的序列号值,此时客户端处于                         TIME_WAIT状态。需要过一阵子以确保服务端收到自己的 ACK 报文之后才会进入                         CLOSED 状态

                      5、服务端收到 ACK 报文之后,就处于关闭连接了,处于 CLOSED 状态。

十四、 Vue3.x 相对于 Vue2.x有哪些变化?

答: 

        1.源码组织方式的变化(使用typescript重写)

        2.Composition API(一组基于函数的API,可以更灵活的组织组件的逻辑);

        3.性能提升V:

                        1.Vue2.0中响应式系统的核心是defineProperty,Vue3.0中使用proxy对象重写响应                           式系统;

                        2.编译优化,Vue2.0中通过标记静态根节点,优化diff的过程,Vue3.0中标记和提                             升所有的静态根节点,diff的时候只需要对比动态节点的内容;

                        3.优化打包体积,Vue3.0移除了一些不常用的API,如inline-template,fiter等

十四、Vue的声明周期

答:  

        vue 的生命周期就是 vue 实例创建到实例销毁的过程。期间会有 8 个钩         子函数的调用。                 beforeCreate(创建实例)                 created(创建完成)、                 beforeMount(开始创建模板)                 mounted(创建完成)、                 beforeUpdate(开始更新)                 updated(更新完成)、                 beforeDestroy(开始销毁)                 destroyed(销毁完成)

 

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。