【前端面试3+1】03深拷贝浅拷贝、let和var、css盒模型、【有效括号】

一、深拷贝浅拷贝

深拷贝和浅拷贝都是用于复制对象或数组的概念,但它们之间有着重要的区别:

1. 浅拷贝:

        浅拷贝是指在拷贝对象或数组时,只会复制一层对象的属性或元素,而不会递归地复制嵌套的对象或数组。因此,如果原始对象或数组中包含引用类型的属性,浅拷贝后的对象或数组中的这些属性仍然指向同一个引用。修改其中一个对象或数组的属性会影响另一个对象或数组。

2. 深拷贝:

深拷贝是指在拷贝对象或数组时,会递归地复制所有嵌套的对象或数组,确保复制后的对象与原始对象完全独立,互不影响。深拷贝会创建一个全新的对象或数组,并递归地复制所有属性或元素,而不仅仅是引用。

        在JavaScript中,实现深拷贝通常需要使用递归方法或专门的库(如lodash的_.cloneDeep()方法)。深拷贝可以确保复制后的对象与原始对象完全独立,适用于需要完全复制对象或数组的场景。

二、 let和var的区别

1. 作用域:
   

  • var声明的变量存在函数作用域(function scope),即在函数内部声明的变量只在函数内部有效,在函数外部无法访问
  • let声明的变量存在块级作用域(block scope),即在块(如if语句、for循环、函数等)内部声明的变量只在该块内部有效,不会受到外部作用域的影响。

2.变量提升:

  • 使用var声明的变量会存在变量提升(hoisting)的现象,即变量的声明会被提升到当前作用域的顶部,但赋值保留在原位置。这意味着可以在变量声明之前访问变量,但其值为undefined
  • 使用let声明的变量也会存在变量提升,但不会被初始化为undefined,而是保持未初始化的状态(暂时性死区),直到变量声明的位置才能访问变量。

三、CSS盒模型 是什么?有哪几种?区别?

1.定义:

        CSS的盒模型是用来描述网页中元素布局的模型,它将每个元素看作是一个矩形的盒子,包含内容区域、内边距、边框和外边距。盒模型的主要作用是确定元素在页面中的大小和位置。

2.类型:

(1)标准盒模型:
  • 在标准盒模型中,元素的宽度和高度只包括内容区域,不包括内边距(padding)和边框(border)
  • 元素的总宽度 = 内容区域宽度 + 左右内边距 + 左右边框
  • 元素的总高度 = 内容区域高度 + 上下内边距 + 上下边框
(2)IE盒模型(怪异盒模型):
  • 在IE盒模型中,元素的宽度和高度包括内容区域、内边距和边框,即宽度和高度直接等于设置的宽度和高度
  • 元素的总宽度 = 内容区域宽度(包括内边距和边框) + 左右外边距
  • 元素的总高度 = 内容区域高度(包括内边距和边框) + 上下外边距

3.区别:

  • 主要区别在于计算元素的宽度和高度时是否包括内边距和边框。标准盒模型只包括内容区域,而IE盒模型包括内容区域、内边距和边框。
  • 大多数现代浏览器采用标准盒模型,而IE浏览器(早期版本)采用IE盒模型。可以通过CSS的box-sizing属性来指定使用哪种盒模型,常见取值为content-box(标准盒模型)和border-box(IE盒模型)。

在实际开发中,为了避免不同浏览器之间的盒模型差异,通常会通过CSS的重置样式或统一设置box-sizing: border-box;来统一盒模型的表现。

四、【算法】有效括号

题目:

给定一个只包括 '('')''{''}''['']' 的字符串 s ,判断字符串是否有效。

有效字符串需满足:

  1. 左括号必须用相同类型的右括号闭合。
  2. 左括号必须以正确的顺序闭合。
  3. 每个右括号都有一个对应的相同类型的左括号。

解法:

  1. 在函数内部,首先获取输入字符串s的长度,并定义一个字符数组stack,大小为输入字符串s的长度。同时定义一个整型变量top,用于表示栈顶的索引,初始值为-1。

  2. 接下来,使用for循环遍历输入字符串s中的每个字符:

(1)如果当前字符是左括号('(','[','{'),则将其压入栈中,即将其放入stack数组中,并更新top的值。

(2)如果当前字符是右括号(')',']','}'),则进行匹配检查:

        ①如果栈为空(即top为-1),说明右括号没有匹配的左括号,直接返回false

        ②否则,取出栈顶元素topChar,并与当前右括号进行匹配:

                 如果匹配不成功,返回false

  •          如果匹配成功,将栈顶元素出栈,即更新top的值。

3.循环结束后,如果栈为空(即top为-1),说明所有括号都能正确闭合,返回true;否则返回false

bool isValid(char* s) {int len = strlen(s);char stack[len];int top = -1;for (int i = 0; i < len; i++) {if (s[i] == '(' || s[i] == '[' || s[i] == '{') {stack[++top] = s[i];} else {if (top == -1) {return false;}char topChar = stack[top--];if ((s[i] == ')' && topChar != '(') || (s[i] == ']' && topChar != '[') || (s[i] == '}' && topChar != '{')) {return false;}}}return top == -1;
}

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

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

相关文章

只用一部手机,为你的吉利车机安装第三方软件(支持大部分车型)

&#x1f4a1; 文中使用的方法为DNS重定向&#xff0c;需要你具备一定的动手能力&#xff0c;否则将无法达到最终目的。 &#x1f4a1; 阅读本文&#xff0c;视为你有一定电脑基础&#xff0c;难以理解时&#xff0c;请寻求百度帮助&#xff0c;百度就是最好的老师&#xff01;…

Redis命令-String命令

4.3 Redis命令-String命令 String类型&#xff0c;也就是字符串类型&#xff0c;是Redis中最简单的存储类型。 其value是字符串&#xff0c;不过根据字符串的格式不同&#xff0c;又可以分为3类&#xff1a; string&#xff1a;普通字符串int&#xff1a;整数类型&#xff0…

小米HyperOS 澎湃os机型免答题 免社区等级 秒接bl锁操作步骤解析

小米机型解锁bl 绕过社区等级5才可以解锁的限制的教程_没有五级社区怎么解锁bl-CSDN博客 上次解析了小米有些出厂不是HyperOS系统的机型绕社区等级接bl锁的操作。目前有更新出厂为HyperOS系统的机型免社区登录等级限制 免答题解锁bl的操作。而且有网友在米14 平板6sp k70这些新…

【MySQL】5.2MySQL高级语句与sql语句

模板 test、class、class0 mysql> select * from test; -------------------------------- | idcard | name | age | hobbid | -------------------------------- | 01 | lizi | 18 | guangjie | | 02 | monor | 22 | zhaijia | | 03 | sansan | …

【Java程序设计】【C00388】基于(JavaWeb)Springboot的校园竞赛管理系统(有论文)

Springboot的校园竞赛管理系统&#xff08;有论文&#xff09; 项目简介项目获取开发环境项目技术运行截图 博主介绍&#xff1a;java高级开发&#xff0c;从事互联网行业六年&#xff0c;已经做了六年的毕业设计程序开发&#xff0c;开发过上千套毕业设计程序&#xff0c;博客…

Fastjson配置消息转换器(时间格式问题)

问题&#xff1a; 我们可以看见&#xff0c;日期的格式有点问题。 由于ArticleListVO类的createTime成员变量是Date类型&#xff0c;默认是由java的Jackson来处理&#xff0c;使用 ISO-8601 规范来处理日期时间格式。ISO-8601 是一种国际标准的日期时间表示法&#xff0c;例如&…

pt-archiver的实践分享,及为何要用 ob-archiver 归档数据的探讨

作者简介&#xff1a;肖杨&#xff0c;软件开发工程师 在数据密集型业务场景中&#xff0c;数据管理策略是否有效至关重要&#xff0c;它直接关系到系统性能与存储效率的提升。数据归档作为该策略的关键环节&#xff0c;不仅有助于优化数据库性能&#xff0c;还能有效降低存储成…

HarmonyOS实战开发-为应用添加运行时权限

介绍 通过AbilityAccessCtrl动态向用户申请“允许不同设备间的数据交换”的权限&#xff0c;使用设备管理实例获取周边不可信设备列表。 说明&#xff1a; 查询周边不可信设备之前&#xff0c;请确保本设备与周边设备未进行配对。如果已配对&#xff0c;则恢复出厂设置之后重新…

软考高级架构师:ESB 企业服务总线概念和例题

作者&#xff1a;明明如月学长&#xff0c; CSDN 博客专家&#xff0c;大厂高级 Java 工程师&#xff0c;《性能优化方法论》作者、《解锁大厂思维&#xff1a;剖析《阿里巴巴Java开发手册》》、《再学经典&#xff1a;《Effective Java》独家解析》专栏作者。 热门文章推荐&am…

景联文科技高质量大模型训练数据汇总!

3月25日&#xff0c;2024年中国发展高层论坛年会上&#xff0c;国家数据局局长刘烈宏在“释放数据要素价值&#xff0c;助力可持续发展”的演讲中表示&#xff0c;中国10亿参数规模以上的大模型数量已超100个。 当前&#xff0c;国内AI大模型发展仍面临诸多困境。其中&#xff…

spring安全框架之Shiro

Shiro 一、现存问题 1.1 现存问题 认证&#xff08;登录&#xff09;&#xff1a;认证操作流程都差不多&#xff0c;但是每次都需要手动的基于业务代码去实现&#xff0c;很麻烦&#xff01; 授权&#xff1a;如果权限控制粒度比较粗&#xff0c;可以自身去实现&#xff0c…

VBA高级应用30例应用2:MouseMove鼠标左键按下并移动鼠标事件

《VBA高级应用30例》&#xff08;版权10178985&#xff09;&#xff0c;是我推出的第十套教程&#xff0c;教程是专门针对高级学员在学习VBA过程中提高路途上的案例展开&#xff0c;这套教程案例与理论结合&#xff0c;紧贴“实战”&#xff0c;并做“战术总结”&#xff0c;以…

实测梳理一下kafka分区分组的作用

清空topickafka-topics.sh --bootstrap-server localhost:9092 --delete --topic second创建分区kafka-topics.sh --create --bootstrap-server localhost:9092 --replication-factor 1 --partitions 3 --topic second发kafka-console-producer.sh --bootstrap-server localhos…

OCP NVME SSD规范解读-15.DSSD set feature功能要求-2

启用IEEE1667隔离区(Enable IEEE1667 Silo)&#xff1a;特征标识符C4h允许开启符合IEEE1667标准的安全存储区功能&#xff0c;以实现数据的隔离和安全存储。 4.15.9章节描述了启用IEEE1667 Silo&#xff08;通过Feature Identifier C4h标识的Set Feature命令&#xff09;的相关…

一个基于.NET Core构建的简单、跨平台、模块化的商城系统

前言 今天大姚给大家分享一个基于.NET Core构建的简单、跨平台、模块化、完全开源免费&#xff08;MIT License&#xff09;的商城系统&#xff1a;Module Shop。 商城后台管理端功能 商品&#xff1a;分类、品牌、单位、选项&#xff08;销售属性&#xff09;、属性、属性模…

面向对象语言的全局认识

学习一门语言&#xff0c;就像在一座陌生的城市旅游&#xff0c;第一步应该找一张这座城市的地图&#xff0c;对这座城市有个整体的了解&#xff0c;然后寻找自己的目的地&#xff0c;不至于迷失方向。 一句话&#xff1a;先整体&#xff0c;再局部。 一.从面向过程到面向对象…

Go-js,css,html压缩和混淆(可直接使用)

前提条件: 本地安装nodejs环境然后配置全局环境变量。 运行以下命令安装uglify压缩工具 npm install uglify-js -g 测试是否安装成功 uglifyjs -v 使用方式: 根据不同的操作系统取对应的压缩工具,然后将压缩工具放到项目根目录下,然后执行即可 工具文件: https://gitee.com…

2024年springboot+vue毕业设计选题推荐

2024年&#xff0c;随着技术的发展和市场需求的变化&#xff0c;基于Spring Boot和Vue的毕业设计选题可以更加注重新兴技术的融合和解决实际问题。以下是一些建议的选题方向&#xff1a; 1. 基于Spring Boot和Vue的智能健康管理系统 - 设计并实现一个集成了运动数据、睡眠监…

CCF-CSP真题202206-2《寻宝!大冒险!》

题目背景 暑假要到了。可惜由于种种原因&#xff0c;小 P 原本的出游计划取消。失望的小 P 只能留在西西艾弗岛上度过一个略显单调的假期……直到…… 某天&#xff0c;小 P 获得了一张神秘的藏宝图。 问题描述 西西艾弗岛上种有 n 棵树&#xff0c;这些树的具体位置记录在…

【目标检测】西红柿成熟度数据集三类标签原始数据集280张

文末有分享链接 标签名称names: - unripe - semi-ripe - fully-ripe D00399-西红柿成熟度数据集三类标签原始数据集280张