公司面试题总结(二)

7. 说说 JavaScript 中的数据类型?存储上的差别?

基本类型:

        o Number
        o String
        o Boolean
        o Undefined
        o null
        o symbol

引用类型

        o Object
        o Array
        o Function

声明变量时不同的内存地址分配:

        o 简单类型的值存放在 中,在栈中存放的是对应的值
        o 引用类型对应的值存储在 中,在栈中存放的是指向堆内存的地址

不同的类型数据导致赋值变量时的不同:

        o 简单类型赋值 ,是生成相同的值,两个对象对应不同的地址
        o 复杂类型赋值
                ▪ 是将保存对象的内存地址赋值给另一个变量。
                ▪ 也就是两个变量指向堆内存中同一个对象

8. typeof 与 instanceof 区别 ,常见的数据类型有哪些,区 别是什么?

typeof 会返回一个变量的基本类型,instanceof 返回的是一个布尔值
instanceof 可以准确地判断复杂引用数据类型,但是不能正确判断基础数据类型
而 typeof 也存在弊端,它虽然可以判断基础数据类型(null 除外),但是引用数据类
型中,除了 function 类型以外,其他的也无法判断
JavaScript 中常用的数据类型判断方法有以下 5 种:
typeof 操作符:可以返回一个字符串,用于表明所操作数的类型。
instanceof 操作符:可以判断一个对象是否属于某个类(或其子类)。
Object.prototype.toString() 方法:可以返回一个表示调用它的对象所属类的字符串。
constructor 属性:可以返回对创建该对象的数组函数的引用。
Array.isArray() 方法:可以判断一个值是否为数组。
        这些方法的区别如下:
typeof 只能区分基本数据类型,不能区分具体的对象类型。
instanceof 只能用于判断对象类型,无法判断基本数据类型
Object.prototype.toString() 方法可以返回对象类型的具体字符串
constructor 属性可以返回对象所属类的构造函数
Array.isArray() 可以判断一个值是否为数组

9. 说说你对闭包的理解?闭包使用场景

闭包指在一个函数内部定义的函数可以访问外部函数作用域中的变量,即使外部函数已经执
行完毕,这种能力称为“闭包”。

优点:

封装变量:

创建私有变量和函数,这样可以避免全局命名冲突,提高代码的可维护性。

延长变量的生命周期:

外部函数执行完毕后,其内部变量不会被销毁,而是被内部函数持有
可以延长变量的生命周期,使得外部函数的变量在内部函数中仍然可用。

实现柯里化:

将接受多个参数的函数转化为接受单一参数的函数
并返回接受剩余参数的函数。

缺点:

内存泄漏:

持有对外部函数作用域的引用,如果这个引用被持续保留
那么外部函数中的变量就无法被释放,导致内存占用过高。

性能问题:

闭包会增加内存消耗和运行时的开销,因为需要维护额外的作用域链。
特别是在循环中使用闭包,可能会导致性能问题。

复杂性:

过度使用闭包可能会导致代码变得难以理解和维护,
闭包使得函数之间的关系变得更加复杂,增加了代码的复杂性和理解成本。

10.bind、call、apply 区别?如何实现一个 bind?

三者第一个参数都是 this 要指向的对象,如果没有这个参数或参数为 undefined 或
        null,则默认指向全局 window
三者都可以传参,但是 apply 是数组,而 call 是参数列表,且 apply 和 call 是一次性
        传入参数,而 bind 可以分为多次传入
bind 是返回绑定 this 之后的函数,apply、call 则是立即执行
实现 bind 的步骤,我们可以分解成为三部分:
        o 修改 this 指向
        o 动态传递参数
                // 方式一:只在 bind 中传递函数参数
                fn.bind(obj,1,2)()
                // 方式二:在 bind 中传递函数参数,也在返回函数中传递参数
                fn.bind(obj,1)(2)
        o 兼容 new 关键字
        Function.prototype.myBind = function (context) {
                // 判断调用对象是否为函数
                if (typeof this !== "function") {
                throw new TypeError("Error");
                }
                // 获取参数
                const args = [...arguments].slice(1),
                fn = this;
                return function Fn() {
                // 根据调用方式,传入不同绑定值
                return fn.apply(this instanceof Fn ? new fn(...arguments) : context,
               args.concat(...arguments));
        }
}

11.说说你对事件循环的理解,宏任务和微任务的理解?

JavaScript 是一门单线程的语言,意味着同一时间内只能做一件事,但是这并不意味着单线
程就是阻塞,而实现单线程非阻塞的方法就是 事件循环
在 JavaScript 中,所有的任务都可以分为:
同步任务:立即执行的任务,同步任务一般会直接进入到主线程中执行
异步任务:异步执行的任务,比如 ajax 网络请求,setTimeout 定时函数等
同步任务进入主线程,即主执行栈,
异步任务进入任务队列
主线程内的任务执行完毕为空,会去任务队列读取对应的任务,推入主线程执行。 上述过程的不断重复就事件循环

微任务

一个需要异步执行的函数,执行时机是主函数执行结束之后、当前宏任务结束之前
Promise.then
MutaionObserver
Object.observe(已废弃;Proxy 对象替代)
process.nextTick(Node.js)

宏任务

宏任务的时间粒度比较大,执行的时间间隔是不能精确控制的,对一些高实时性的
需求就不太符合
script (可以理解为外层同步代码)
setTimeout/setInterval
UI rendering/UI 事件
postMessage、MessageChannel
setImmediate、I/O(Node.js)
按照这个流程,它的执行机制是:
执行一个宏任务,如果遇到微任务就将它放到微任务的事件队列中
当前宏任务执行完成后,会查看微任务的事件队列,然后将里面的所有微任务依次执行

12.DOM 常见的操作有哪些?

DOM(文档对象模型) 是用于表示 HTML 和 XML 文档的树状结构,并且允许程序和脚
本动态地访问和更新文档内容、结构和样式。在 JavaScript 中,常见的 DOM 操作包括
但不限于以下几种:

文档对象模型 (DOM) :

HTML 和 XML 文档的编程接口
提供了对文档的结构化的表述
定义了一种方式可以使从程序中对该结构进行访问,从而改变文档的结构,样式和内容
任何 HTML 或 XML 文档都可以用 DOM 表示为一个由节点构成的层级结构
<p title="title">content</p >
p 就是元素节点,
content 就是文本节点,
title 就是属性节点

创建节点

createElement
创建新元素,接受一个参数,即要创建元素的标签名
const divEl = document.createElement("div");
createTextNode
创建一个文本节点
const textEl = document.createTextNode("content");
createDocumentFragment
用来创建一个文档碎片,它表示一种轻量级的文档,主要是用来存储临时节
点,然后把文档碎片的内容一次性添加到 DOM 中 const fragment = document.createDocumentFragment();
当 请 求 把 一 个 DocumentFragment 节点插入文档树时,插入的不
是 DocumentFragment 自身,而是它的所有子孙节点
createAttribute
创建属性节点,可以是自定义属性
const dataAttribute = document.createAttribute('custom');

获取节点

document. getElementById ('id 属性值');返回拥有指定 id 的对象的引用
document. getElementsByClassName ('class 属性值');返回拥有指定 class 的对象集
document. getElementsByTagName ('标签名');返回拥有指定标签名的对象集合
document. getElementsByName ('name 属性值'); 返回拥有指定名称的对象结合
document/element. querySelector ('CSS 选择器'); 仅返回第一个匹配的元素
document/element. querySelectorAll ('CSS 选择器'); 返回所有匹配的元素
document. documentElement ; 获取页面中的 HTML 标签
document. body ; 获取页面中的 BODY 标签
document. all ['']; 获取页面中的所有元素节点的对象集合型
除此之外,每个DOM 元素还有parentNode、childNodes、firstChild、lastChild、nextSibling、
previousSibling 属性

更新节点

innerHTML
不但可以修改一个 DOM 节点的文本内容
还可以直接通过 HTML 片段修改 DOM 节点内部的子树
innerText、textContent
自动对字符串进行 HTML 编码,保证无法设置任何 HTML 标签
innerText 不返回隐藏元素的文本,
textContent 返回所有文本
style
DOM 节点的 style 属性对应所有的 CSS,可以直接获取或设置。
遇到-需要转化为驼峰命名

添加节点

innerHTML
如果这个 DOM 节点是空的,直接使用 innerHTML = '<span>child</span>'
修改 DOM 节点的内容,相当于添加了新的 DOM 节点
appendChild
把一个子节点添加到父节点的最后一个子节点
insertBefore
把子节点插入到指定的位置,使用方法如下:
parentElement.insertBefore(newElement, referenceElement)
setAttribute(属性名,属性值)
在指定元素中添加一个属性节点,如果元素中已有该属性改变属性值

删除节点

调用父节点的 removeChild 把自己删掉
删除后的节点虽然不在文档树中了,但其实它还在内存中,可以随时再次被添加到 别的位置

替换节点:

parentNode. replaceChild (newNode, oldNode): 替换一个子节点为新的节点。

查找相邻节点:

element. nextElementSibling : 获取当前元素的下一个兄弟元素。
element. previousElementSibling : 获取当前元素的上一个兄弟元素。

获取元素尺寸和位置:

element. offsetWidth 和 element. offsetHeight : 获取元素的布局宽度和高度,包
含边框和内边距。
element. clientWidth 和 element. clientHeight : 获取元素内容区的宽度和高度,
不包括滚动条、边框和外边距。
element. getBoundingClientRect (): 获取元素相对于视口的位置和尺寸信息。

事件处理:

element. addEventListener (eventType, callback): 给元素添加指定事件类型的监听
器。
element. removeEventListener (eventType, callback): 移除元素指定事件类型的监
听器。

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

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

相关文章

嵌入式Linux系统编程 — 3.3 chown、fchown 和 lchown 函数更改文件属主

目录 1 文件属主 1.1 文件属主概念 1.2 如何查看文件属主 1.3 有效用户 ID 和有效组 ID 2 chown 函数 2.1 chown命令 2.2 chown函数 2.3 getuid 和 getgid函数 3 fchown函数 3.1 fchown函数简介 3.2 示例代码 4 lchown函数 1 文件属主 1.1 文件属主概念 Linux…

tkinter颜色选择器

tkinter颜色选择器 颜色选择器效果代码 颜色选择器 Tkinter 提供了一个简单易用的颜色选择器模块 colorchooser&#xff0c;通过调用 colorchooser.askcolor() 方法&#xff0c;我们可以轻松实现颜色选择功能。 效果 代码 import tkinter as tk from tkinter import colorch…

angularJS资料

return home 目录结构 文章目录 [toc]angular4工作angular2下arcgis开发angular2相关资料BootstrapJavaScriptJavaScript视频教程 TypeScriptHTML CSS菜鸟教程 http://www.runoob.com/手册网 http://www.shouce.ren/w3school http://www.w3school.com.cn/ angular4 angular-CLI…

CSS函数: translate、translate3d的使用

translate()和translate3d()函数可以实现元素在指定轴的平移的功能。函数使用在CSS转换属性transform的属性值。实现转换的函数类型有&#xff1a; translate()&#xff1a;2D平面实现X轴、Y轴的平移translate3d()&#xff1a;3D空间实现位置的平移translateX()&#xff1a;实…

LLVM Cpu0 新后端4

想好好熟悉一下llvm开发一个新后端都要干什么&#xff0c;于是参考了老师的系列文章&#xff1a; LLVM 后端实践笔记 代码在这里&#xff08;还没来得及准备&#xff0c;先用网盘暂存一下&#xff09;&#xff1a; 链接: https://pan.baidu.com/s/1V_tZkt9uvxo5bnUufhMQ_Q?…

向量数据库是什么?

向量数据库是什么&#xff1f; 随着人工智能和机器学习技术的迅猛发展&#xff0c;向量数据库作为一种新型数据库引起了广泛关注。向量数据库专门用于存储和查询高维向量数据&#xff0c;是在大规模数据检索和相似性搜索领域的重要工具。 向量数据库的定义 向量数据库是一种…

#09 Stable Diffusion动画制作入门

文章目录 前言1. 理解Stable Diffusion2. 动画制作的基本概念3. 准备阶段3.1 设计文本提示3.2 选择参数 4. 制作过程4.1 生成图像序列4.2 合成动画 5. 后期处理5.1 调色和特效5.2 输出格式 6. 最佳实践结论 前言 随着AI技术的飞速发展&#xff0c;Stable Diffusion作为一种先进…

定时清理Linux服务器缓存shell脚本

服务器内存占用过高,如何定时清理一下服务器内存呢?写一个清理缓存脚本,加入到定时任务中。 一、编写脚本 clear_cache.sh 脚本,放到home目录下。 #!/bin/bash# 清除页面缓存、目录项和 inode 缓存 sudo sync echo 3 | sudo tee /proc/sys/vm/drop_caches# 记录执行时间到日…

为下一波创新做准备:人工智能和元宇宙

人工智能和元宇宙的发展带来了独特的可能性和挑战。随着这些技术的发展&#xff0c;我们进入了一个沉浸式虚拟体验和智能系统的时代&#xff0c;我们正站在一个历史性的时刻。为迎接下一波创新&#xff0c;采取必要的措施是很重要的。 我们正在见证两项变革性技术的激动人心的发…

qt中网络编程关于QNetworkReply导致崩溃

现场项目上线之后&#xff0c;使用中总是闪退&#xff0c;release版本exe不好查找问题&#xff0c;困扰了我好几天&#xff0c;最后发现导致问题的可能点是&#xff1a;由于请求的网址都是一样的&#xff0c;只是请求数据不一样&#xff0c;所以只使用了一个reply&#xff0c;即…

数据赋能(113)——体系:监控数据采集——实施过程、应用特点

实施过程 监控数据采集的实施过程通常包括以下步骤&#xff1a; 明确监控目标&#xff1a;需要明确监控数据的采集目标&#xff0c;包括需要监控哪些数据、监控的目的以及预期的监控效果。确定监控数据源&#xff1a;确定监控数据来源&#xff0c;这包括各种数据库、网络设备…

WebSocket前端分页:技术深度、实践困境与未来展望

WebSocket前端分页&#xff1a;技术深度、实践困境与未来展望 在前端开发的广阔领域中&#xff0c;WebSocket前端分页技术以其独特的优势逐渐崭露头角。它不仅为开发者带来了全新的交互体验&#xff0c;也为用户带来了更加流畅和高效的信息获取方式。然而&#xff0c;这一技术…

以sqlilabs靶场为例,讲解SQL注入攻击原理【54-65关】

【Less-54】 与前面的题目不同是&#xff0c;这里只能提交10次&#xff0c;一旦提交超过十次&#xff0c;数据会重新刷新&#xff0c;所有的步骤需要重来一次。 解题步骤&#xff1a; 根据测试&#xff0c;使用的是单引号闭合。 # 判断字段的数量 ?id1 order by 3 -- aaa# …

WPF视频学习-基础知识篇

1.简介WPF&#xff1a; C# 一套关于windows界面应用开发框架 2.WPF和winform的差别 &#xff0c;(WPF比较新) 创建新项目使用模板&#xff1a; WPF使用.xaml后缀&#xff0c;双击可查看操作界面和设置代码&#xff0c;其文件展开之后中有MainWindow.xaml.cs为程序交互逻辑。…

云上小知识:企业选择云服务的小Tips

企业在选择云服务模式时&#xff0c;应综合考虑以下几个关键因素&#xff1a; 1. 业务需求与场景 企业需要根据自身的业务特点和需求来选择合适的云服务模式。例如&#xff0c;如果企业的用户分布广泛&#xff0c;需要跨地域提供服务&#xff0c;那么公有云可能是更好的选择。…

【Python】数据处理:文本文件操作

在Python中&#xff0c;处理文本文件是非常常见的任务。可以使用内置的open函数来打开、读取和写入文本文件。 打开文件 使用open函数打开文件。该函数有两个主要参数&#xff1a; open(file, moder, buffering-1, encodingNone, errorsNone, newlineNone, closefdTrue, ope…

Windows 批处理(bat) 中文件操作使用教程

文章目录 dir&#xff1a;列出当前目录下的文件和子目录cd&#xff1a;改变当前目录md 或 mkdir&#xff1a;创建新目录rd 或 rmdir&#xff1a;删除目录del&#xff1a;删除一个或多个文件copy&#xff1a;复制文件到另一个位置xcopy&#xff1a;用于复制目录及其内容到另一个…

#08 文本到图像转换:Stable Diffusion的创意应用

文章目录 前言1. 文本提示的艺术1.1 创意描述1.2 故事叙述 2. 图像生成的技巧2.1 参数调整2.2 风格迁移 3. 创意应用实例3.1 艺术创作3.2 商业设计3.3 社交媒体内容 4. 实践指南4.1 实验与迭代4.2 学习与借鉴4.3 版权与伦理 结论 前言 Stable Diffusion作为一种先进的AI图像生…

mysqldump常用备份数据库命令

mysqldump 是 MySQL 数据库的官方命令行备份工具。以下是一些常用的 mysqldump 数据库备份命令示例&#xff1a; 备份单个数据库&#xff1a; mysqldump -u username -p database_name > database_name_backup.sql这里 username 是你的数据库用户名&#xff0c;database_nam…

JVM:Java虚拟机探秘

JVM&#xff1a;Java虚拟机探秘 简介 Java Virtual Machine&#xff08;JVM&#xff09;&#xff0c;作为Java技术的核心&#xff0c;是一个抽象化的计算模型&#xff0c;负责执行Java字节码。它不仅为Java程序提供了跨平台运行的能力&#xff0c;还通过内存管理、垃圾回收、…