初级前端面试(2)

news2024/12/26 21:33:30

1.讲一下闭包相关知识,和普通函数有什么区别

闭包是什么:JS中内层函数可以访问外层函数的变量,外层函数无法操作内存函数的变量的特性。我们把这个特性称作闭包。

闭包的好处:

隔离作用域,保护私有变量;有了闭包才有局部变量,要不然都是全局变量了。
让我们可以使用回调,操作其他函数内部;
变量长期驻扎在内存中,不会被内存回收机制回收,即延长变量的生命周期;
闭包的弊端:内层函数引用外层函数变量,内层函数占用内存。如果不释放内存,过多时,易引起内存泄露。

解决办法:无法自动销户,就及时手动回收,使用后将函数的引用赋null。

闭包深入理解

那如果有ab两个函数,b作为a的参数传入,a中要怎么使用b呢 ,回答了callback函数 面试官说也确实可以实现
另外的方法:
//定义一个add函数
function add(){
console.log(“这是加法函数!”);
}
//定义一个计算函数counter,并将函数method作为参数,并调用了method()
function counter(method){
method();
}
//调用了counter()函数,并将函数add作为参数传进去
counter(add);
//运行的结果为:这是加法函数!
总结:
①. 将函数作为另一个函数的参数使用,只需要在调用另一个函数时,将函数作为参数传递进去。另一个函数已经完成对传进来函数的调用。
②. 同时需要注意的是:在js中,函数也是对象,所以是引用传地址,函数名就是指向该对象的地址,所以将函数作为参数的时候,只需要将函数名写入即可。

特别说明:这里的函数作为另一个函数的参数使用,也就是闭包的使用,可以访问函数内部的变量。
参考文档

2.怎么理解css的选择器权重问题 如果没有这个权重设定可以吗 会出现什么问题

从样式选择器看权重优先级:important > 内嵌样式 > ID > 类 > 标签 | 伪类 | 属性选择 > 伪对象 > 继承 > 通配符。

important的权重为1,0,0,0
ID的权重为0,1,0,0
类的权重为0,0,1,0
标签的权重为0,0,0,1
伪类的权重为0,0,1,0
属性的权重为0,0,1,0
伪对象的权重为0,0,0,1
通配符的权重为0,0,0,0

当权重不同时,权重高的显示;当权重相同时,后写的样式起作用,我回答可以完成一些用户交互的样式切换效果

3.手写冒泡排序,并且讲思路

    // 编写方法,实现冒泡
    var arr = [29,45,51,68,72,97];
    //外层循环,控制趟数,每一次找到一个最大值
    for (var i = 0; i < arr.length - 1; i++) {
        // 内层循环,控制比较的次数,并且判断两个数的大小
        for (var j = 0; j < arr.length - 1 - i; j++) {
            // 白话解释:如果前面的数大,放到后面(当然是从小到大的冒泡排序)
            if (arr[j] > arr[j + 1]) {
                var temp = arr[j];
                arr[j] = arr[j + 1];
                arr[j + 1] = temp;
            }
        }
 
    }
    console.log(arr);//[2, 4, 5, 12, 31, 32, 45, 52, 78, 89]

参考博客

4.深浅拷贝问题

、深拷贝与浅拷贝的区别?

拷贝的层级不同,深拷贝是指每一层数据的改动都不会影响原对象和新对象,浅拷贝只有第一层的属性变动不互相影响,深层的数据变动还会互相影响。

2、实现拷贝的方法有哪些?

浅拷贝:数组可以用拓展运算符[...arr],或者slice().浅拷贝对象可以用Object.assign({},obj)

深拷贝:JSON.parse(JSON.stringify(obj)),或封装递归方法,或使用第三方库的方法,比如  JQuery的$.extend({},obj),或者lodash 的cloneDeep

3、JSON.parse(JSON.stringify(obj))处理的缺点?

如果对象中有属性是function或者undefined,处理后会被过滤掉;
如果属性值是对象,且由构造函数生成的实例对象,会丢弃对象的constructor;

5.原型和原型链,有什么作用

原型:在js中,每一个对象(函数也是对象)都有一个特殊的属性叫做原型(prototype),它指向另一个对象,这个对象(Test.prototype)被称为原型对象, 原型对象是用来共享属性和方法的。

	(1)原型对象有一个constructor属性指向构造函数本身(Test)。

    (2)原型对象是一个普通的对象,它包含属性和方法。

    (3)原型对象的属性和方法会被继承到所有通过原型链与它相连的对象。

    简单来说,原型对象是一个普通对象,属性和方法会被继承到其他对象,而每个对象都有一个原型(prototype),用来继承其他对象的属性和方法。

原型链:指一些原型通过__proto__指针构成的链表,一个原型链可以为想共享原型链中数据的对象服务,用于实现JavaScript中的继承机制。

(原型链指针) 原型链中涉及到的指针:

每个对象都有一个__proto__指针来访问对象的原型
每个原型都是一个用于实现继承的对象,除了有__proto__指针之外,还有constructor指针指向构造函数
每个函数都是一个对象,除了有__proto__指针之外,还有prototype指针指向与之关联的原型对象,prototype的指向和__proto__指向不一定相同。

在这里插入图片描述

6.讲一个比较好的项目或者是项目中的收获

7.假如我们要做一个表单,需要校验,是前端校验还是后端校验好,

回答了都可以做,如果前端做了校验,但后端拿到的数据还是有问题怎么办 比如伪造了一个请求 如果前端做了后端还需要吗 我说最好是要 前端只能做简单的用户交互熟输入的一些校验没办法判断接口类的校验

8.这个表单如何实现

面试前刚好做个vue3的后台管理项目, 就讲了大概思路 大家看个组件库就会了

9.点击按钮提交数据,然后按钮置灰,但是点击够快可能会多次提交,影响业务,怎么处理

回答了防抖
思路:在用户多次点击按钮时,我们选择保留最后一次事件触发,即在点击到事件触发这段时间,如果用户再点击,则将上一次点击的操作取消,而等待执行新点击的操作,以此类推;
参考文献:手写防抖函数

10.获取两个接口数据,但两个接口数据互相有依赖,b接口需要a接口数据去做一些逻辑处理,你遇到这种问题怎么处理

回答了使用async await 直到接收到a接口数据再去请求b接口
问还有没有其他方法 回答了没想到
问能不能通过同步请求两个接口 判断接口返回code码是200 成功的

11.开发的时候遇到没用过的插件或者技术栈 一般怎么学习

这个问题就属于开放题,可以自由发挥
我当时回答的是官方文档、掘金、github以及一些论坛和社区
刚好在踩坑nvm,于是就把这个踩坑经历和面试官分享了

后续的就是对公司情况的一些了解,以及直接和老板谈薪了,其实一开始还做了一轮笔试,但是题目已经记不太清了,目前已经顺利入职啦(对于一年多没从事开发行业的我来说,已经很满意了~~),接下来就是技术沉淀 沉淀 再沉淀 最后也祝各位读者也能顺利入职!!!

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

快速了解接口测试

1、定义 什么是接口测试&#xff1f; 接口测试是测试系统组件间接口的一种测试。接口测试主要用于检测外部系统与系统之间以及内部各个子系统之间的交互点。测试的重点是要检查数据的交换&#xff0c;传递和控制管理过程&#xff0c;以及系统间的相互逻辑依赖关系等。 接口测…

Vue3高级API的使用

介绍 在前面的内容中&#xff0c;我们已经学习到了很多 Vue 3 的基础语法与一些常用的 API。 本节我们将介绍一些高级 API&#xff0c;带领大家进一步深入了解 Vue 3。 主要内容 ●customRef() ●markRaw() ●toRaw() ●获取 DOM 元素 customRef 方法 customRef&#…

DNS隧道技术原理及其典型应用场景剖析

DNS隧道&#xff08;DNS Tunneling&#xff09;本质为一种网络通信技术&#xff0c;它利用DNS协议在客户端和服务器之间传输数据&#xff0c;主要用来绕过网络限制进行数据隐蔽传输&#xff0c;但在实际场景中&#xff0c;DNS隧道已经成为黑客忠爱的攻击媒介。 1. 概览 DNS是互…

Linux之HugePage的原理与使用

Linux之HugePage的原理与使用 虚拟地址与物理地址虚拟地址物理地址虚拟地址与物理地址的转换 HugePage的概念Linux使用HugePage创建HugePage在程序中使用HugePage 总结 虚拟地址与物理地址 在研究HugePage之前&#xff0c;首先需要明白虚拟地址和物理地址的概念。在计算机系统…

baby_web-CTFWeb进阶wp-攻防世界14

baby_web-CTFWeb进阶wp-攻防世界14 页面显示1.php&#xff0c;可以先访问下源码和index.php&#xff0c;发现内容一致&#xff0c;再查看下cookie和header&#xff0c;看一下有没有藏flag&#xff0c;发现没。 dirsearch一下&#xff0c;发现访问index.php会重定向到1.php。抓…

想一键获取视频文案?2024年这3款好用的视频转文字工具来帮忙

嘿&#xff0c;咱们现在活在21世纪&#xff0c;这信息多得跟啥似的。视频这东西&#xff0c;不管是学东西、娱乐还是工作&#xff0c;都挺受欢迎的&#xff0c;因为它直观、生动嘛。但是&#xff0c;有时候咱们想从视频里提取点有用的信息&#xff0c;还挺费劲的。幸好啊&#…

深圳大学-Java程序设计-选实验2 类的初级应用

实验目的与要求&#xff1a; 实验目的&#xff1a;初步掌握面向对象编程中类的编写。 实验要求&#xff1a; (1).运行第4章课件中第4页、第24页、第32页和第34页中的四个程序&#xff0c;并对每一行语句加上注释。对每一行语句加上注释。在报告中附上程序截图、运行结果截图和…

zerotier安装配置

目录 1.简介1.1.基本概念1.1.1.节点1.它可以是:2.每个节点都有以下特征:3.节点的主要功能包括: 1.1.2.根服务器1.定义&#xff1a;2.功能&#xff1a;3.特点&#xff1a;4.角色&#xff1a;5.安全性&#xff1a;6.与普通节点的区别&#xff1a;7.自托管选项&#xff1a; 1.1.3.…

51单片机的智能电饭煲【proteus仿真+程序+报告+原理图+演示视频】

1、主要功能 该系统由AT89C51/STC89C52单片机LCD1602显示模块温度传感器继电器按键、LED等模块构成。适用于智能电饭锅等相似项目。 可实现功能: 1、LCD1602实时显示温度、运行模式、煮饭等模式的计时时间 2、首先选择电饭锅的模式&#xff0c;如煮饭、煮粥、蒸、煲汤&#…

React入门 9:React Router

1. 什么是路由 路由&#xff08;routing&#xff09;就是通过互联的网络把信息从源地址传输到目的地址的活动。 以上是中文维基百科对路由的解释。通俗的来讲&#xff0c;把一个地方的信息传输到他想去的目的地的过程&#xff0c;就叫路由。 2. 用代码解释路由 需求&#xff1a…

【Spring】获取Cookie和Session(@CookieValue()和@SessionAttribute())

获取 Cookie 传统获取 Cookie 这是没有 Spring 的时候&#xff0c;用 Servlet 来获取&#xff08;获取所有的 Cookie&#xff09; Spring MVC 是基于 Servlet API 构建的原始 Web 框架&#xff0c;也是在 Servlet 的基础上实现的 RequestMapping("/getcookie") …

CubeMX电机驱动以及编码器计数配置

一、选型 电机MG310&#xff1a; 电机驱动板TB6612&#xff1a; STM32F407VETx&#xff1a; 二、CubeMX配置 配置外部时钟&#xff1a; GPIO口配置&#xff1a; 需要四个I/O输出口&#xff1a; PWM口配置&#xff1a; 这里使用的是定时器TIM1&#xff0c;设置预分频器71&…

使用mnist数据集和LeakyReLU高级激活函数训练神经网络示例代码

一、概述 神经网络中的激活函数是用于增加网络的非线性特性的函数&#xff0c;没有激活函数&#xff0c;神经网络将仅仅是一个线性模型&#xff0c;无法解决复杂的非线性问题。激活函数的选择对神经网络的性能有很大的影响。 基础激活函数是神经网络中使用较早、较为简单的激…

AOA定位技术在智慧停车场中的应用

‌AOA定位技术是一种基于信号到达角度的定位方法&#xff0c;通过测量无线信号到达接收器的入射角度来实现精确定位。‌ AOA定位技术的核心原理是利用接收器内的多个天线阵列来测量信号的相位差&#xff0c;从而计算出信号的到达角度&#xff0c;最终确定位置‌。 在智慧停…

SpringBoot在高校学科竞赛平台中的应用与优化

2相关技术 2.1 MYSQL数据库 MySQL是一个真正的多用户、多线程SQL数据库服务器。 是基于SQL的客户/服务器模式的关系数据库管理系统&#xff0c;它的有点有有功能强大、使用简单、管理方便、安全可靠性高、运行速度快、多线程、跨平台性、完全网络化、稳定性等&#xff0c;非常…

数据结构之旅(顺序表)

前言: Hello,各位小伙伴们我们在过去的60天里学完了C语言基本语法,由于小编在准备数学竞赛,最近没有给大家更新,并且没有及时回复大家的私信,小编在这里和大家说一声对不起!,小编这几天会及时给大家更新初阶数据结构的内容,然后我们来学习今天的内容吧! 一. 顺序表的概念和结…

鸿蒙开发案例:通过三杯猜球学习显示动画

【引言】 “三杯猜球”是一个经典的益智游戏&#xff0c;通常由一名表演者和多名参与者共同完成。表演者会将一个小球放在一个杯子下面&#xff0c;然后将三个杯子快速地交换位置&#xff0c;参与者则需要猜出最终哪个杯子下面有小球。本文将介绍如何使用HarmonyOS NEXT技术&a…

加速AI+医疗普惠:AI如何让乳腺癌筛查走进大山?

人工智能与超声技术的结合正在医疗领域引发一场新变革。 近日&#xff0c;贵州省铜仁市石阡县妇幼保健院与广州尚医网信息技术有限公司&#xff08;以下简称“尚医云”&#xff09;联合组织了一场“AI点亮女性健康未来”免费乳腺癌筛查活动&#xff0c;目前已为当地1,500名适龄…

物联网:一种有能力重塑世界的技术

物联网&#xff08;IoT&#xff09;近年来对我们的日常生活产生了如此积极的影响&#xff0c;以至于即使是不懂技术的人也开始相信它所带来的便利以及敏锐的洞察力。 物联网是一场数字技术革命&#xff0c;其意义甚至比工业革命更为重大。物联网是仍处于起步阶段的第四次工业革…

重学SpringBoot3-安装Spring Boot CLI

更多SpringBoot3内容请关注我的专栏&#xff1a;《SpringBoot3》 期待您的点赞&#x1f44d;收藏⭐评论✍ 重学SpringBoot3-安装Spring Boot CLI 1. 什么是 Spring Boot CLI&#xff1f;2. Spring Boot CLI 的安装2.1. 通过 SDKMAN! 安装2.2. 通过 Homebrew 安装&#xff08;适…