- 博客(26)
- 收藏
- 关注
原创 十分钟快速让你搞懂 Vue3 和 React 的区别
它们都采用了组件化的开发模式,使得开发者可以将复杂的应用拆分为多个小组件进行开发,从而提高了代码的可维护性和重用性。然而,虽然Vue 3和React都拥有各自的优点,但它们也存在着一些不同之处,本文将通过比较两者的相同点和不同点来帮助读者更好地理解Vue 3和React。Vue 3和React都采用了组件化开发的方式,使得代码具有更好的可维护性和重用性。虚拟DOM是一个轻量级的JavaScript对象,它描述了UI界面的状态和结构,当数据发生变化时,框架会通过比较前后两个虚拟DOM树的差异来进行页面更新。
2024-11-03 18:39:49 767
原创 TypeScript面向对象&接口&泛型
接口(interface)是对象的模板,可以看作是一种类型约定。他定义了一组方法规范,这些方法规范由那些实现了该接口的类具体实现。接口本身不实现这些方法,它只是规定了实现类必须遵循的方法签名。// 报错// 报错上面示例中,type两次定义了类型A,导致两行都会报错。作为比较,interface则会自动合并。foo: 1,bar: 1上面示例中,interface把类型A的两个定义合并在一起。
2024-10-27 18:01:52 886
原创 TypeScript基础(一): 初识TypeScript
never` 是 `void` 的子类型,但 `void` 不是 `never` 的子类型。- `void` 类型的变量实际上只能被赋值为 `undefined` 或者 `null`(如果你在 TypeScript 配置中启用了 `--strictNullChecks` 或 `--strict`,则只能是 `undefined`)。- `never` 是 `any`、`unknown`、`never` 之外的所有类型的子类型,这意味着你可以将 `never` 类型的变量赋值给任何类型。
2024-10-21 21:30:02 1057
原创 node入门与npm
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境,允许开发者在服务器端运行 JavaScript 代码。npm是 Node.js 的默认包管理器,用于管理 JavaScript 项目中的依赖关系。
2024-10-21 19:59:36 833
原创 Vue3-Pinia
●介绍○Pinia 是 Vue 的最新状态管理工具,是 Vuex 的替代品。○优势○提供更加简单的 API(去掉了mutation○提供符合组合式风格的 API,与 Vue3 新语法统一。○去掉了modules的概念,每一个 store 都是一个独立的模块。○配合 TypeScript 更加友好,提供可靠的类型推断。○手动添加 Pinia 到 Vue 项目○在实际开发项目的时候,关于 Pinia 的配置,可以在项目创建时自动添加。○手动添加的步骤:。
2024-10-20 15:38:50 840
原创 Vue3高级API的使用
在前面的内容中,我们已经学习到了很多 Vue 3 的基础语法与一些常用的 API。本节我们将介绍一些高级 API,带领大家进一步深入了解 Vue 3。本节我们主要为大家介绍了一些高级 API,我们来简单的复习一下:●customRef,这个 API 是用来显式控制其依赖项的跟踪和更新触发的,它接收 track() 和 trigger() 作为参数。●markRaw() 方法标记一个对象,使其永远不会被转换为代理(Proxy),而是返回对象本身。
2024-10-13 18:06:17 1250
原创 深入探索Vue3组合式API
reactive 和 ref 是 Vue 3 中的两种响应式数据绑定方式,ref 适用于简单的响应式数据,而 reactive 则适用于复杂对象或数组的响应式数据。ref:用于声明 基本类型 或者单个变量的响应式数据。ref 的核心在于它包装了一个值,当这个值变化时,依赖它的视图会重新渲染。注意:ref 返回的是一个对象,其中的值通过 .value 属性访问。// 0reactive:用于声明 对象 或 数组 的响应式数据。reactive 更适合处理复杂的数据结构(对象或数组)。
2024-10-06 15:29:08 1628 1
原创 Vue2与Vue3: 关键差异与新特性介绍
Proxy是 ES6 引入的一种新的数据结构,它允许你创建一个对象的代理,从而在访问对象的属性或方法时进行拦截和自定义操作。Proxy对象有两个参数:目标对象和处理器对象,处理器对象定义了当操作被执行时的自定义行为。},Vue2:数据通过data()函数定义,方法在 methods 对象中定义Vue3:引入setup()函数作为组件的入口点,集中定义数据和方法Vue 3 带来了许多令人兴奋的新特性和改进,包括组合式 API、更好的 TypeScript 支持、性能提升等。
2024-10-06 10:15:04 1477
原创 JavaScript高级程序设计(一)(二)章
重点介绍介绍ECMAScript 和DOM标准。在此基础上探讨客户端检测、事件、动画、表单、错误处理及JSON,最后介绍近年涌现的最新和最重要的规范,包括Fetch API、模块、工作者线程、服务线程以及大量新API。JavaScript历史回顾JavaScript是什么JavaScript与ECMAScript的关系JavaScript的不同版本。
2024-09-22 22:18:27 1152
原创 计算机网络八股文-2
1.HTTP 分为长连接和短连接,本质上说的是TCP的长短连接。TCP连接是一个双向的通道,它是可以保持一段时间不关闭的,因此TCP连接才具有真正的长连接和短连接这一说法。2.TCP长连接可以复用一个TCP连接,来发起多次的HTTP请求,这样就可以减少资源消耗,比如一次请求HTML,如果是短连接的话,可能还需要请求后续的JS、CSS。
2024-09-01 18:31:07 878
原创 JS统计字符串出现频率
统计字符串中每个字符出现的频率可以通过几种不同的方法实现。以下是几种常见的方法:统计字符串中每个字符出现的频率可以通过几种不同的方法实现。
2024-08-12 16:09:44 501
原创 JS判断括号字符串是否有效
当我们使用数组来模拟栈的操作时,入栈和出栈的过程可以通过数组的 push 和 pop 方法来实现。出栈操作会移除并返回栈顶的元素。如果为空,说明所有的左括号都找到了对应的右括号,返回 true;入栈操作即为数组的 push 方法,出栈操作即为 pop 方法。这种使用数组模拟栈操作的方法非常直观和有效,适用于许多算法和数据结构问题,特别是像括号匹配这样的场景。给定一个只包括 '(',')','{','}','[',']' 的字符串 s ,判断字符串是否有效。1.入栈操作(push)将元素添加到数组的末尾。
2024-08-04 21:38:15 547
原创 如何封装一个最简单的Axios
我们这里只做了最最最基础的 axios 封装,但是可扩展性较高。相较于其它文章的过度封装,这里的封装形式其实可以满足大部分应用场景了。请求拦截里面针对 token 进行处理响应拦截里面判断 token 是否过期等等在 config/index.js 里面动态更改 baseURL在请求拦截里面根据业务场景修改请求头在拦截里面设置全局请求进度条等等。
2024-07-28 19:57:58 583
原创 Vue2生命周期总结
如果使用Vue框架,那么学习它的声明周期是不可避免的。人的一生分为了:幼年、少年、青年、中年、老年等阶段,我们需要在不同的阶段去做不同的事。一个 Vue 应用也是如此,只不过它将生命周期的各个阶段用钩子函数替代了,钩子函数内部就是我们需要做的事情。官网的一张图就非常清晰的介绍了一个 Vue 应用或者组件的生命周期:vue生命周期分为四个阶段第一阶段(创建阶段):beforeCreate,created第二阶段(挂载阶段):beforeMount(render),mounted。
2024-07-17 21:55:10 675
原创 使用 JS 实现单链表
*** 创建节点* 表示我们想要添加到链表中的项*/// 要加入链表元素的值// 当一个 Node 实例被创建时,它的 next 指针总是 undefined, 因为我们知道它会是链表的最后一项(push)// 指向链表中下一个元素的指针/*** 比较链表中的元素是否相等*/CreateNode 类作用:用于创建链表的节点。描述:这个类定义了单链表中的节点对象。ele和next。ele:存储节点的值,即要添加到链表中的项。next:指向链表中下一个节点的指针。
2024-07-16 09:58:38 503
原创 JavaScript面向对象编程
对象: 万物皆对象类: 对对象的细分实例: 类中的具体事物实例类对象1NumberObject"1"StringObject[1,2,3]ArrayObjectture、falseBooleanObjectnullNullObjectUndefinedUndefinedObjectfunction()FunctionObjectDateDateObject{name:"1"}ObjectObject/^$/RegExpObject。
2024-07-08 22:28:17 588
原创 深入理解JS中变量提升、作用域(链)和this关键字
定义一个函数有两种方式: 函数声明(和 函数表达式(语法: function name(arguments) { }对参数而言, primitive parameter是 传值, 对象是传引用语法: var fun = function (arguments) { }函数表达式中函数可以不需要名字, 即匿名函数1.2.3其它还可以用 Funtion 构造函数来创建函数在函数内部引用函数本身有3种方式, 比如 var foo = function bar () { };
2024-06-16 19:01:38 1076 1
原创 JavaScript获取URL参数的几种方法
在前端开发中,处理URL参数是一个常见的任务,尤其是在没有框架支持的情况下。虽然许多框架提供了方便的方法来获取URL参数,但有时我们需要依赖原生JavaScript来完成这个任务。这也是面试中经常出现的问题之一。今天让我们一起来探讨如何利用原生JavaScript来获取URL参数值。原生JS获取URL链接参数的方法有好几种,我们一起来学习一下常见的几种。1.使用正则表达式2.利用a标签内置方法3.利用split分割方法4.使用URLSearchParams方法。
2024-06-04 19:55:06 8201 1
原创 CSS3属性选择器
CSS3属性选择器提供了一种更灵活和精确的选择元素的方法,可以根据元素的属性及其属性值来选择元素并应用样式。通过灵活运用属性选择器,你可以更好地控制页面的样式和布局,使得CSS代码更加清晰、简洁和易于维护。
2024-04-21 19:24:21 485
原创 十分钟快速入门JQuery教程
1.JQuery是一个快速、简洁的JavaScript代码库(或JavaScript框架)。JQuery设计的宗旨是"Write less, Do more",即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。2.如何把jQuery引入到HTML页面中?jQuery就是一个普通的js文件,引入方式和一般JavaScript文件一样。3.jQuery基本使用案例:<head>
2024-04-08 20:52:29 402
原创 初级开发者详解HTML5中的本地存储用法
HTML5提供了Web Storage和IndexedDB两种主要的本地存储技术,开发者可以根据需求选择合适的方式。Web Storage适用于简单的键值对存储,而IndexedDB更适用于存储结构化数据和大量数据。通过学习并灵活运用这些本地存储技术,开发者可以提高Web应用程序的性能和用户体验。希望本文对初级开发者理解HTML5中的本地存储用法有所帮助!
2024-04-07 19:58:15 176
原创 web前端实例:JS鼠标拖拽效果
JavaScript 鼠标拖拽效果是一种常见的交互技术,通过监听鼠标事件和操作元素的位置来实现用户拖拽元素的功能。该技术的实现原理包括鼠标事件的监听、确定拖拽对象、跟随鼠标移动以及释放拖拽对象。具体实现中,需要考虑事件监听、元素定位、位置计算等技术要点,并注意边界控制、性能优化和兼容性问题。触摸事件与鼠标事件相比,具有不同的触发方式、事件对象和适用性,更适用于移动设备和平板电脑等触摸屏设备。
2024-02-17 09:28:20 1759 1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人