前端面试基础面试题——1

fcd8bca838f641fdadae11a6bb57cfde.gif

 总结了一些基础的面试题 如果大家有兴趣的话可以关注留意一下 今后会不断更新一些面试题 

1.JavaScript  中的 AJAX  原理及应用。

2.什么是闭包?请简单描述一下闭包的特点与应用场景。

3.请简述 HTTPS  与 HTTP  的区别,如何保证 HTTPS   的安全性?

4.请简述对 MVVM   框架的理解

5.如何解决浏览器兼容性问题?

6. JavaScript  中的原型、原型链及其作用。

 7.Vue.js 中的双向数据绑定原理及其优势。 

8.JavaScript 中的深浅拷贝及其实现方法

9.JavaScript  中的递归及其应用。

10. JavaScript  中的 Promise  (承诺)及其作用。

1.JavaScript  中的 AJAX  原理及应用。

  JavaScript 中的 AJAX(Asynchronous  JavaScript  and  XML) 是一种用于创建异步请求和处理服务响应的技术,将数据发送到服务器和从服务器接收数据都是异步进行的,不会干扰页面的正常操作。AJAX 的原理基于 XMLHttpRequest   对象,可以使用原生 JavaScript 或者 jQuery 等库进行开发,在前端 Web  开发中应用广泛,可以用于实现动态网页、数据交互等功能。

2.什么是闭包?请简单描述下闭包的特点与应用场景。

闭包是指嵌套在函数内部的函数,它可以访问其它函数作用域中的变量,即使这些变量在函数调用结束后仍然存在。

        闭包的特点:

                1.可以访问函数外部的变量

                2.内部函数持有外部函数作用域

                3.可以访问外部函数的参数和局部变量

                4.外部函数返回后,内部函数仍然会持有外部函数作用域

        闭包的应用场景:

                1.封装类库,隐藏内部实现细节

                2.延迟执行,如事件绑定和回调函数

                3.模拟块级作用域,如在循环中创建定时器

                4.作为立即执行函数 (IIFE)使用,防止变量污染全局命名空间

3.请简述 HTTPS   HTTP  的区别,如何保证 HTTPS   的安全性?

HTTPS(HyperText  Transfer  Protocol  Secure) 是 HTTP  协议的加强版,通过 SSL/TLS  协议对数据进行加密传输,保证通信安全可靠。

        区别如下:

                1.HTTP   通信使用明文传输,安全性较低;HTTPS  使用 SSL/TLS  对数据进行加密传输,安全性高。

                2.HTTP   默认使用80端口, HTTPS   默认使用443端口。

                3.HTTPS   需要使用数字证书,由CA 机构颁发,保证通信双方身份合法性。

        保证 HTTPS  安全性的措施:

                1.TLS 握手过程中使用非对称加密算法 (RSA、DSA、ECC 等)协商对称加密算法和密钥。

                2.证书链验证确保通信双方的身份合法性。

                3.使用快速加密算法,如 AES(Advanced   Encryption   Standard) 等。

                4.cookie 安全性管理,如禁止通过 http 传输,使用 Secure、HttpOnly  属性等。

                5. 开启 HTTP  Strict  Transport  Security(HSTS), 防止中间人攻击,使用 Content Security Policy(CSP)  防止 XSS 和 CSRF  攻击。

4.请简述对 MVVM   框架的理解

  MVVM是Model-View-ViewModel的缩写,一种前端框架的思想。在 MVWM架构中,View 和

ViewModel是相互独立的,二者使用数据绑定技术实现数据双向绑定。

        MVVM框架的优点:

                1.双向数据绑定和自动更新视图,减少大量手动操作 DOM的代码。

                2.代码组织清晰,模块化开发,View 和ViewModel分离,方便代码维护和协作开发。

                3.官方和第三方库丰富,提供了大量现成的组件和功能。

        MVVM框架的缺点:

                1.数据绑定会消耗一定的内存和性能,尤其是对于大规模数据更新时,性能消耗更为明显。

                2.需要学习一些新的语法和使用规则。

                3.组件的可定制性较低,需要在框架提供的范围内进行定制。 

5.如何解决浏览器兼容性问题?

可以使用CSS Hack、JavaScript Polyfill、IE6-8特有的CSS 属性等方法来解决浏览器的兼容性问题。也可以使用CSS 规范、 JavaScript细节的书写来避免出现兼容性问题。

6. JavaScript  中的原型、原型链及其作用。

   JavaScript 中的原型 (prototype) 指的是一个对象的共享属性和方法;原型链是由原型对象和其属性所 组成的链状结构。 JavaScript 是一种基于原型的语言,利用原型和原型链机制可以实现对象的继承和共享属性和方法的复用。

 7.Vue.js 中的双向数据绑定原理及其优势。 

 Vue.js 中的双向数据绑定是指当数据模型发生变化时,视图会自动更新,同时当用户在视图中操作时,数据模型也会自动更新。双向数据绑定的原理是利用 Object.defineProperty 函数监控数据变化,并在变化时更新相关视图。双向数据绑定的优势包括减少代码量、提高开发效率和可维护性。

8.JavaScript 中的深浅拷贝及其实现方法

 JavaScript 中的深浅拷贝是指复制对象或数组时是否复制其值或者只是复制其引用。

        浅拷贝只复制了一 个对象或数组的引用,而深拷贝则是创建一个完全独立的对象或数组,是基于值复制而不是基于引用复制。

        实现方法包括使用 ES6 的扩展运算符、使用 JSON  序列化和反序列化等。

9.JavaScript  中的递归及其应用。

 JavaScript 中的递归是一种在函数之内调用自身的行为,可以用于处理具有递归结构的数据或操作。递 归的应用包括处理复杂的数学计算、解决复杂的问题(如数据搜索、遍历、排序等)和处理复杂的数据结构等。递归需要注意的问题包括栈溢出、递归停止条件、递归深度等

10. JavaScript  中的 Promise  (承诺)及其作用。

 CSS  Flexbox 布局(又称 Flex 布局)是一种用于实现灵活和响应式布局的 CSS3  特性,可以实现各复杂的布局,并且适用于所有的终端设备和屏幕尺寸。 

        Flexbox 可以通过定义容器和子元素的属性来实现元素之间的布局关系。 Flexbox 引入了以下几个概念:

        ● Flex 容器:包裹 Flex  元素的父元素,用于定义 Flex  元素的布局。

        ● Flex 元素: Flex  容器的子元素,用于定义 Flex  元素的大小、位置等属性。

        ● 主 轴 (Main  Axis): 定义 Flex  容器的主要方向。

        ● 交 叉 轴 (Cross  Axis):  与主轴垂直的轴,用于实现元素在主轴上的对齐。

        使用 Flex 布局可以通过设置 display: flex 来定义 Flex 容器,从而实现元素之间的灵活布局和响应式设计。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/89935.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【软考】系统集成项目管理工程师(三)信息系统集成专业技术知识①【16分】

一、系统集成的特点 官方解释: 1、信息系统建设的内容主要包括设备采购、系统集成、软件开发和运维服务等; 2、信息系统集成是指将计算机软件、硬件、网络通信、信息安全等技术和产品集成为能够满足用户特定需求的信息系统;显著特点如下&am…

算法通关村第9关【白银】| 二分查找与搜索树高频问题

基于二分查找的拓展问题 1.山脉数组的峰顶索引 思路&#xff1a;二分查找 山峰有三种状态&#xff1a;需要注意数组边界 1.顶峰&#xff1a;arr[mid]>arr[mid1]&&arr[mid]>arr[mid-1] 2.上坡&#xff1a;arr[mid]<arr[mid1] 3.下坡&#xff1a;arr[mid]…

常见的移动端布局

流式布局&#xff08;百分比布局&#xff09; 使用百分比、相对单位&#xff08;如 em、rem&#xff09;等来设置元素的宽度&#xff0c;使页面元素根据视口大小的变化进行调整。这种方法可以实现基本的自适应效果&#xff0c;但可能在不同设备上显示不一致。 <!DOCTYPE ht…

java项目mysql转postgresql

特殊函数 &#xff1a; mysql&#xff1a; find_in_set(?, ancestors) postgresql&#xff1a; ? ANY (string_to_array(ancestors,,)) mysql&#xff1a; date_format(t1.oper_time, %Y-%m-%d) postgresql&#xff1a; rksj::date to_char(inDate,YYYY-MM-DD) mysql&am…

Haproxy+Keepalive 整合rabbitmq实现高可用负载均衡

Haproxy 实现负载均衡 HAProxy 提供高可用性、负载均衡及基于 TCPHTTP 应用的代理&#xff0c;支持虚拟主机&#xff0c;它是免费、快速并且可靠的一种解决方案&#xff0c;包括 Twitter,Reddit,StackOverflow,GitHub 在内的多家知名互联网公司在使用。HAProxy 实现了一种…

数组 刷题常用

在写数组模拟常用到数组&#xff0c;借此把常用的记下来以便查阅 一维数组&#xff0c;若初始化为0&#xff0c;可以用int a[N] {0}或者int a[N]{}. 但是若是其他值&#xff0c;不可类似地初始化为int a[N] {0}&#xff0c;而应写成memset或者fill赋值的方法。 首先便是二维…

大数据-玩转数据-Flink窗口函数

一、Flink窗口函数 前面指定了窗口的分配器, 接着我们需要来指定如何计算, 这事由window function来负责. 一旦窗口关闭, window function 去计算处理窗口中的每个元素. window function 可以是ReduceFunction,AggregateFunction,or ProcessWindowFunction中的任意一种. Reduc…

关于使用远程工具连接mysql数据库时,提示:Public Key Retrieval is not allowed

我在使用DBeaver工具连接 数据库时&#xff0c;提示&#xff1a;Public Key Retrieval is not allowed&#xff0c; 我在前一天还是可以连接的&#xff0c;但是今天突然无法连接了&#xff0c; 但是最后捣鼓了一下又可以了。 具体方法&#xff1a;首先先把mysql服务停了&#x…

git rebase和merge区别

一、概述 merge和rebase 标题上的两个命令&#xff1a;merge和rebase都是用来合并分支的。 这里不解释rebase命令&#xff0c;以及两个命令的原理&#xff0c;详细解释参考这里。 下面的内容主要说的是两者在实际操作中的区别。 1.1 什么是分支 分支就是便于多人在同一项目…

Java基础 数据结构一【栈、队列】

什么是数据结构 数据结构是计算机科学中的一个重要概念&#xff0c;用于组织和存储数据以便有效地进行访问、操作和管理。它涉及了如何在计算机内存中组织数据&#xff0c;以便于在不同操作中进行查找、插入、删除等操作 数据结构可以看作是一种数据的组织方式&#xff0c;不…

性能优化维度

CPU 首先检查 cpu&#xff0c;cpu 使用率要提升而不是降低。其次CPU 空闲并不一定是没事做&#xff0c;也有可能是锁或者外部资源瓶颈。常用top、vmstat命令查看信息。 vmstat 命令: top: 命令 IO iostat 命令&#xff1a; Memory free 命令&#xff1a; 温馨提示&#xff1a…