- 博客(74)
- 收藏
- 关注
原创 前端知识点---本地存储(javascript)
localStorage 是浏览器提供的一个 本地存储 API,可以在用户的浏览器中存储数据,数据不会随页面刷新而丢失。
2025-04-04 22:26:37
323
原创 前端知识点---promise链(javascript)
Promise 链(Promise chain)是指通过 Promise 对象的 then() 方法将多个异步操作按顺序串联起来,实现异步操作的顺序执行。每个 then() 方法都会返回一个新的 Promise,从而可以继续调用后续的 then() 方法。通过链式调用,可以避免回调地狱(callback hell),使代码更加简洁和可读。
2025-03-31 21:34:01
737
原创 webgl知识点---类型化数组
WebGL 操作的是 GPU而不是 CPU, webgl很吃显卡性能GPU 需要直接读取二进制数据,而不是普通的 JavaScript 数组。类型化数组提供内存中的原始二进制数据,GPU可以高效地读取。普通 JavaScript 数组存储的是对象,会有额外的元数据和指针,效率低。类型化数组使用定长的二进制数据,内存占用小。WebGL 使用 GLSL(OpenGL Shading Language) 编写的着色器需要特定的数据格式。类型化数组直接映射到内存中的数据块,支持快速的读取和写入。
2025-03-31 20:44:28
677
原创 前端知识点---window.location.assign() 和 window.location.href 的区别(javascript)
如果需要读取 URL 或简单跳转,href 更方便;如果只想执行跳转且强调跳转行为,assign() 更合适。平常用的window.location.href 更多。
2025-03-28 22:02:21
426
原创 前端知识点---事件监听器里面的e.target跟this的区别,e.target在事件委托中的好处
在事件监听器中,e.target 和 this 有时是一样的,但它们并不完全相同。✅ 相同点当事件直接绑定到元素时:e.target 和 this 通常指向相同的元素,即事件绑定的元素。// 指向 #btnlog;// 指向 #btn;</解释:this 指向的是事件绑定的元素。e.target 指向的是实际触发事件的元素。在这种情况下,它们相同。
2025-03-28 11:18:16
373
原创 前端知识点 --- border-Radius的四个角(css)
左上角:水平半径20%,竖直半径5%右上角:水平半径5%,竖直半径20%右下角:水平半径20%,竖直半径5%左下角:水平半径5%,竖直半径20%
2025-03-27 11:09:54
335
原创 前端知识点---事件委托和机制-阻止冒泡机制-阻止默认行为机制(javascript)
事件委托是一种将事件监听器绑定到父元素上,利用事件冒泡机制来处理子元素事件的技术。事件冒泡:当一个元素上的事件被触发时,事件会从目标元素向上冒泡到其父元素,直至根元素(document)。e.stopPropagation():阻止事件从当前目标元素继续向上冒泡,不会触发父元素的事件监听器。e.stopPropagation() 的作用是 阻止事件继续冒泡,让事件不会再传递到父元素。e.stopPropagation() 只阻止事件冒泡,不会阻止同一元素上的其他事件执行。
2025-03-26 14:29:50
1033
原创 前端知识点---innerHTML和innerText
innerHTML 主要用于处理 HTML 内容(包括标签),并且可以动态插入 HTML 代码。但它的使用需要小心,尤其是在处理用户输入时,因为可能引发 XSS 攻击。innerText 仅操作纯文本内容,适合用来获取或设置文本,忽略 HTML 标签和样式。相较之下,innerText 更安全。✅ 示例:innerHTML 和 innerText 的使用。✅ innerHTML 与 innerText 对比。
2025-03-24 17:09:09
274
原创 前端知识点---添加节点(javascript)
在 DOM(文档对象模型)中,“添加到节点” 通常是指将一个新创建的元素或节点添加到现有的 HTML 元素中。动态添加元素: 比如在待办事项应用中,点击“添加任务”按钮时,你可以动态地向页面中添加新的一项任务。动态内容更新:你可以在页面加载后动态地插入新的内容(例如添加新的一项任务到待办事项列表)。交互性:用户与网页的交互可能会触发页面内容的变化(例如点击按钮时添加新元素)。appendChild():将新节点添加为子节点(追加到父节点的末尾)。insertBefore():将新节点插入到指定的节点前面。
2025-03-24 17:03:37
361
原创 前端知识点 --- 事件监听器(javascript)
✅ 事件监听的基本语法element:目标元素。event:事件类型,如 ‘click’、‘mouseover’、‘keydown’ 等。function:事件发生时执行的回调函数。useCapture (可选):true 表示在捕获阶段触发事件,false 表示在冒泡阶段触发事件(默认)。🧑💻 示例 1:点击事件✅ 解释:当你点击按钮时,事件监听器会捕捉到 ‘click’ 事件并执行弹窗。🧑💻 示例 2:鼠标移入事件✅ 解释:鼠标移入 mouseover 时,背景颜色变红。
2025-03-24 16:21:15
1141
原创 前端知识点---一行代码检测数据类型(javascript)
typeof 只能检测基本数据类型和函数, instanceof不能检测基本数据类型如何一句话检测数据类型呢?结果是一个全为小写的字符串。
2025-03-17 14:26:15
425
原创 前端知识点---window里的api(javascript)
→ 这些是 JavaScript 语言本身提供的,而不是浏览器 BOM。→ 这些属于 DOM API,而不是 BOM。→ 这些是 Web API,不属于 BOM。→ 这些都是典型的 BOM API。
2025-03-17 10:12:06
114
原创 前端知识点---原型-原型链(javascript)
继承与扩展 Dog.prototype = Object.create(Animal.prototype) 复用父类方法,减少代码重复。是指向 Object.prototype,而 Object.prototype 的。方法共享 User.prototype.sayHello 让多个实例共享方法,节省内存。扩展原生对象 Array.prototype.sum 添加全局通用方法,增强功能。
2025-03-15 19:14:01
911
原创 前端面试题---vue项目打包时, 内存不足了怎么办 为什么会出现这样的情况
增加 Node.js 内存限制(最有效)关闭 Source Map启用 Webpack 缓存减少 Webpack 处理的文件启用 Webpack 多进程升级 Vue CLI 和 Webpack这样可以显著降低打包时的内存占用,提高构建速度。
2025-03-15 15:21:11
791
原创 前端知识点---typedof和instanceof的区别(javascript)
typeof 适合基本类型(string, number, boolean, undefined, function 等)。instanceof 适合判断对象的具体类型(Array, Date, Function 等)。
2025-03-15 09:44:04
419
原创 前端0基础---day19正则表达式(javascript)
正则表达式,又名 “规则表达式”正则是JS中的数据类型, 是一个复杂数据类型由我们自己来书写 “规则”,专门用来检测字符串是否符合 “规则” 使用的我们使用一些特殊的字符或者符号定义一个 “规则公式”,然后用我们定义好的 “规则公式” 去检测字符串是不是合格上面的变量reg就是定制好的规则检测str1这个字符串的时候,符合规则检测str2这个字符串的时候,不符合规则\d等价于[0-9],表示匹配一个数字,表示一个或多个。所以\d+就是“匹配一个或多个数字”,而/\d+/
2025-03-12 19:58:29
999
原创 前端知识点---为什么箭头函数没有构造函数(javascript)
普通函数箭头函数有 prototype,可作为构造函数没有 prototype,不能作为构造函数this 指向调用者,可变this 定义时绑定,不可变适合作为对象方法、构造函数适合回调函数、数组方法(map、filter)适用于 new 关键字创建对象不能用 new。
2025-03-12 15:51:05
232
原创 前端0基础---day18Math - Date - 定时器 (javascript)
因为JavaScript中的定时器(setTimeout 或 setInterval)是异步执行的,返回一个唯一的ID。这个ID用于区分不同的定时器,以便能精确地停止某个定时器。回调函数本身并不是必须的,但它是在设置定时器时用来指定触发时要执行的代码。不是所有的回调函数都是异步进行的 分为同步回调和同步回调。** 统计字符串中各个字母(或元素)出现的次数**同步回调:在当前执行上下文中直接执行的回调。异步回调:异步回调必须在主线程完成之后调用。清除定时器要先获取到定时器的 ID。
2025-03-10 21:55:20
347
原创 前端知识点---http.createHttp()的理解(arkts)
你可以在 http.createHttp() 里设置 默认请求头、超时时间,后续请求都会继承这些设置,就像你的 专属客服记住了你的点餐习惯。✅ http.createHttp() 就像是建立了一个外卖客服专线,你可以随时通过这个专线点餐,而不需要每次都重新拨号。✅ 如果不用 http.createHttp(),你每次点餐都要重新拨号(创建新的 HTTP 请求实例),会很麻烦。http.createHttp() 让你只创建 一个 HTTP 客户端,不用每次都重新拨号(创建新连接)。
2025-03-08 21:35:26
719
原创 前端知识点---库和包的概念
包(Package) 是指一组代码库的封装,通常包含多个库(Library)、依赖关系和元数据(如 package.json 之类的描述文件)。库(Library) 是一组可复用的代码集合,提供特定功能(如网络请求、UI 组件、数据处理等)。💡 可以理解为:「工具箱」(里面装了多个工具,比如锤子、螺丝刀等)。💡 可以理解为:「工具箱」里的一个工具(比如一把锤子)。
2025-03-08 21:17:38
369
原创 前端知识点---路由模式-实例模式和单例模式(ts)
在 ArkTS(Ark UI 框架)中,路由实例模式(Standard Instance Mode)主要用于管理页面跳转。当创建一个新页面时,可以选择标准实例模式(Standard Mode)或单实例模式(Single Mode)。mode: RouterMode.Standard → 使用标准实例模式,每次跳转都会创建新的 PageB 实例。不会复用已有的页面实例,每次跳转都会创建新的页面实例,用户返回时可以看到之前的页面状态。例如:表单页面,每次填写新表单都会创建新的实例。
2025-03-08 20:58:48
869
原创 前端知识点---前端里的接口
接口是对象的模版, 类也是对象的模版类可以被具体实现 可以new一个类, 接口只能用来定义类型 接口没法被具体实现 没法new一个接口和类都是对象的模版, 接口只能用来定义类型id: number;id: 1,name: '张三',接口作为类型定义:用于指定对象的结构和类型,确保代码类型安全,特别是在 TypeScript 中使用。API 接口:指前端与后端进行数据交互的接口,通过 HTTP 请求来获取或发送数据。
2025-03-08 17:14:53
689
原创 前端面试题---.onChange() 事件与焦点机制解析
焦点(focus) 指的是 当前正在操作的元素(如输入框、按钮)。只有一个元素能同时拥有焦点。✅ 如果想输入时立即触发,使用 oninput 或 .onChange()
2025-03-04 20:33:07
238
原创 前端面试题---JavaScript、TypeScript 和 Vue 中的值传递与引用传递对比
引用传递(pass by reference,名词):将变量的地址传递给函数,修改参数会影响原变量,适用于对象类型(如 object、array、function)值传递(pass by value,名词):将变量的副本传递给函数,修改副本不会影响原变量,适用于基本数据类型(如 number、string、boolean)。
2025-03-04 16:20:41
419
原创 前端面试题---小程序跟vue的声明周期的区别
小程序的生命周期主要分为 页面生命周期 和 应用生命周期。每个页面和应用都有自己独立的生命周期函数。小程序的应用生命周期函数与全局应用相关,通常包括以下几个钩子:onLaunch(options):应用初始化时触发。这个函数在应用生命周期内只会调用一次。onShow(options):当应用从后台进入前台时触发,比如用户打开小程序时,或者从其他页面返回时。onHide():当应用进入后台时触发,比如用户退出小程序或者切换到其他应用时。
2025-02-27 09:24:39
682
原创 前端面试题---vue router 哈希模式和历史模式有什么区别
服务器配需要服务器支持 HTML5 的 history.pushState,否则会出现 404 错误,因为直接刷新或访问子路由时,服务器需要返回正确的 HTML 页面。不需要特别配置服务器,因为 # 后面的部分不会发送到服务器,所有请求都指向同一个页面。历史模式:更清晰的 URL,但需要配置服务器支持 HTML5 历史记录。简单,不需要额外的服务器配置,兼容性好,适用于没有控制服务器的情况。哈希模式:不需要服务器配置,适合简单应用,但 URL 中有 #。
2025-02-26 21:11:23
237
原创 前端学习---day17数组去重和ASCII码(javascript)
思路是: 准备一个新数组, 遍历原来的数组, 如果新数组中没有这个元素,(这用newarr.indexOf(arr[i])===-1) 那就存入新数组, 如果发现新数组里已经有某个元素, 那就不会再存入新数组, 这种方式和前面两个的不同是不改变原来的数组。这里就出现问题了 , 实际上我们想要第二个11和第三个11进行比较 这在初始数组里是arr[1]和arr[2], 但是由于数组长度减少一个 , 所以要让数组元素减少后的数组在进行内层循环的时候j–, j 会回到当前删除位置, 检查已经修改位置的元素。
2025-02-25 14:08:07
1279
原创 手把手教学之前端0基础到就业---day15part1(javascript)
你定义在哪一个作用域下的变量,就是哪一个作用域的私有变量该变量只能在该作用域及其后代作用域中使用// f2 : 定义在 f1 私有作用域的变量// 只能在 f1 及其 f1 的后代作用域内使用// 全局不能使用 f2// 这里可以使用 num 吗?// 可以, 因为 f2 是 f1 的后代作用域f2()// num 只能在 f1 和 f1 的后代作用域内使用f1()
2025-02-25 08:23:33
943
原创 [原创]手把手教学之前端0基础到就业---day15堆和栈 + 作业part3(Javascript)
假设你正在开发一个购物网站,需要计算用户购物车中商品的总价。请编写一个函数,接收一个包含多个商品对象的数组,计算购物车中所有商品的总价,并显示每个商品的名称、单价、数量以及该商品的总价。要求用户输入温度的数值和类型(摄氏度或华氏度),然后输出转换后的结果。问题描述:你正在设计一个学生成绩管理系统,要求实现一个函数,能够输入一组学生的成绩,并按照成绩从高到低排序,然后输出排名。栈内存: 按序排列, 先来的在栈底, 后来的在栈顶 , 就像是堆叠盘子一样的。返回每个商品的总价,以及所有商品的总价。
2025-02-24 20:46:20
517
原创 [原创]手把手教学之前端0基础到就业---day15递归(javascript)
写完了递归算法, 运行的时候,经常会遇到栈溢出的错误,就是没写终止条件或者终止条件写的不对,操作系统也是用一个栈的结构来保存每一层递归的信息,如果递归没有终止,操作系统的内存栈必然就会溢出。第二步 :确定单层递归的基本逻辑 , 这里的逻辑 就是 如果传递进来的不是5 那就是当前数字加上比当前数字大1的数字 , 代码是return n+add(n+1)需要有初始化,自增,执行代码,条件判断的,不然就是一个没有尽头的递归函数,我们叫做。确定哪些参数是递归的过程中需要处理的,那么就在递归函数里加上这个参数。
2025-02-24 20:41:04
333
原创 前端面试题---vue和react的区别
Vue 是一个完整的框架,提供了从模板到状态管理的全套解决方案;React 是一个 UI 库,主要聚焦于构建用户界面,其他功能依赖第三方库。Vue 的语法更简洁,易于上手,适合初学者;React 使用 JSX,结合了 JavaScript 和 HTML,学习曲线较陡。Vue 使用类似 HTML 的模板语法,而 React 使用 JSX(将 HTML 和 JavaScript 混合在一起)。两者都优化了性能,使用虚拟 DOM 技术。React 拥有更大的社区和生态系统,Vue 的社区较小但增长迅速。
2025-02-24 09:25:25
623
原创 前端面试题---vue3中组合式api和选项式api的区别
结构:通过 data、methods、computed 等选项定义组件的状态、方法和计算属性。特点:适合小型、简单组件,易学易用,但随着逻辑复杂,代码易分散,不易维护。
2025-02-24 09:17:11
430
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人