WeiyuRAN.-CSDN博客

原创 JavaScript 基础知识点总结

JavaScript作为前端开发的核心语言，涵盖了从基础语法到实战应用的关键知识。本文系统梳理了JavaScript的核心内容：1）基础语法包括变量声明(var/let/const)、数据类型(原始/引用类型)及类型转换；2）流程控制涉及条件判断(if/switch)和循环结构(for/while/do-while)；3）常用内置对象如Math的随机数生成、Date日期处理以及字符串操作方法。通过示例代码演示了变量作用域、类型比较、循环控制等核心概念，帮助开发者掌握JavaScript基础，为Web开发奠定

2026-02-20 23:12:48 782

原创 JS鉴权之JWT 与 Session-Cookie 优缺点对比

本文对比分析了JWT和Session-Cookie两种主流Web鉴权方案的优缺点。Session-Cookie是传统的有状态方案，服务器端维护会话状态，通过Cookie传递会话标识，适合单体应用但扩展性较差；JWT则是无状态方案，通过加密Token传递用户信息，适合分布式系统但无法主动失效。文章从核心原理、代码实现、优缺点及分布式解决方案等维度进行深入解析，为不同场景下的技术选型提供指导。Session方案可通过Redis实现分布式共享，而JWT则天然支持跨服务认证。开发人员应根据业务规模、安全需求和架构特

2026-02-04 20:49:27 613

原创 CSS知识点总结：居中、背景图引入及显示隐藏区别

本文总结了前端开发中三个关键知识点：1）元素居中的五种方法（Flex/Grid布局、绝对定位、文本居中、margin-auto），推荐优先使用Flex/Grid；2）背景图片引入的四种方式（url()、内联样式、伪元素、CSS渐变），适配不同场景需求；3）overflow:hidden、display:none和opacity:0的核心区别，包括是否占用空间、可交互性等。文章通过代码示例和对比表格，为开发者提供了清晰的技术选型指导。

2026-02-02 22:01:15 602

原创 React新闻管理项目笔记之Day1

本文介绍了前端开发中常用的技术组合：JSON-Server模拟接口、Axios封装请求和Login登录页面实现。首先详细讲解了JSON-Server的安装配置和使用方法，包括RESTful API模拟、端口设置和数据监听。其次介绍了Concurrently工具实现多命令并行执行，提升开发效率。然后重点阐述了Axios的封装技巧，包括基础配置、拦截器实现和API模块化管理。最后展示了Login页面的React实现，包含状态管理、Ant Design组件使用、样式定制和路由跳转等功能。这套技术方案能有效支持前端

2026-02-02 21:43:42 592

原创前端基础之正则表达式

本文系统介绍了正则表达式在前端开发中的核心知识点与实战应用。内容涵盖正则基础语法、常用修饰符、边界定位、量词控制、字符类等核心概念，以及分组捕获、或操作等高级用法。通过手机号脱敏、密码验证、颜色匹配等典型场景，展示了正则表达式在字符串处理中的强大能力。文章强调正则表达式是前端表单验证和字符串处理的高效工具，建议开发者掌握其核心语法，并善用可视化工具提升开发效率。

2026-02-01 17:17:52 700

原创前端基础之Webpack

本文介绍了Webpack前端打包工具的基础使用流程。首先讲解了Webpack的核心功能是将多个前端资源文件打包成可直接运行的静态文件。接着详细说明了环境准备步骤：安装Node.js、初始化项目、添加Webpack核心依赖（webpack和webpack-cli）及常用Loader（css-loader、babel-loader等）。重点解析了webpack.config.js配置文件的编写方法，包括打包模式设置、入口/出口配置、模块处理规则（CSS、图片、ES6+语法转换）和插件使用（如自动生成HTML）。

2026-01-30 13:09:08 899

原创 JS小知识点之打乱数组的方法（洗牌）

本文介绍了JavaScript中三种数组打乱（洗牌）方法：1）简洁版使用sort(() => Math.random() - 0.5)，适合简单场景但公平性不足；2）严谨版采用Fisher-Yates洗牌算法，保证每个元素位置概率均等，时间复杂度O(n)，适合抽奖等公平性要求高的场景；3）权重版通过给元素绑定随机权重排序，在公平性和代码简洁度间取得平衡。建议根据业务需求选择，核心业务优先Fisher-Yates算法，同时注意操作副本数组避免污染原数据。不同方法主要在随机公平性和执行效率上存在差异。

2026-01-29 20:08:33 995

原创前端基础之CSS

本文系统梳理了CSS核心知识点，涵盖基础语法与引入方式、选择器体系（基础/组合/高级选择器及权重规则）、盒子模型（组成、类型、BFC解决外边距问题）、元素显示模式与隐藏控制、浮动与清除浮动、定位体系、样式美化（背景/文本/视觉样式、三角形实现）、单位与计算函数等核心内容。总结了CSS「选择器+属性」的核心逻辑，明确盒子模型、浮动、定位是布局关键，同时提炼了`calc()`、文本省略号等高频实用技巧，既适用于新手夯实基础，也可作为前端开发的快速参考。

2026-01-27 21:01:01 1180

原创 React新手村：一步步掌握前端开发利器Day5

本文介绍了React中状态管理库的核心概念与应用，重点讲解了Redux和Redux Toolkit(RTK)的使用方法。首先阐述了状态管理库的必要性，指出React原生状态管理在复杂场景下的局限性。接着详细演示了RTK的安装、配置流程，包括创建store、定义slice、注册reducer等关键步骤。文章通过具体案例展示了同步状态修改和参数传递的实现方式，包括useSelector获取状态、useDispatch触发action、payload传参等核心API的使用。最后通过年龄修改的完整示例，说明了如何在

2026-01-27 16:19:04 1258

原创 React新手村：一步步掌握前端开发利器Day4

本文介绍了React Router v6的核心使用场景，包括基础配置、路由跳转、传参、鉴权和错误处理。主要内容：基础配置：通过createBrowserRouter创建路由表，使用RouterProvider挂载到根组件路由跳转：使用Link/NavLink组件实现声明式导航，NavLink支持动态样式控制路由传参：三种方式：动态路由传参（useParams获取）查询传参（useSearchParams获取） state传参（useLocation获取）路由鉴权：通过自定义Hook实现路由守卫，

2026-01-26 20:49:30 557

原创 React新手村：一步步掌握前端开发利器Day3

React Hooks 是让函数组件具备状态管理、生命周期等能力的系列内置函数，解决了类组件代码冗余、逻辑复用难等问题。核心规则包括：只能在函数组件顶层调用，不能嵌套在条件或循环中。常用 Hooks 有： useState：定义和修改状态 useEffect：处理副作用和生命周期（挂载/更新/卸载） useMemo：缓存计算结果优化性能 useCallback：缓存函数引用 Hooks 通过"钩入"React核心特性（如useState钩入状态管理），使函数组件能实现类组件的所有功能，同

2026-01-23 16:37:01 554

原创了解ES6及其常用特性

ES6是2015年发布的ECMAScript 6.0标准，主要特性包括：let/const解决变量作用域问题；箭头函数简化定义和this绑定；模板字符串支持变量嵌入；解构赋值快速提取数据；模块化支持import/export；类语法替代原型链；Promise处理异步；扩展运算符简化数据操作。这些特性显著提升了JavaScript的开发效率和代码可读性。

2026-01-22 21:51:44 341

原创 JS小知识点之关于this 指向

本文详细介绍了JavaScript和React中this的指向规则及修改方法。在原生JS中，this指向取决于调用场景：普通函数指向全局/undefined，对象方法指向调用对象，构造函数指向实例，DOM事件指向触发元素，箭头函数继承外层this。修改方法包括call、apply和bind。在React类组件中，生命周期方法指向实例，未绑定方法指向undefined，箭头函数继承实例this。修改方法推荐构造函数bind绑定或使用箭头函数，避免调用时bind

2026-01-22 16:42:22 612

原创 JS小知识点之数组循环

本文总结了JavaScript中九种数组循环遍历方法的特性及适用场景。map方法适用于数据转换和React列表渲染；for循环适合精准控制遍历过程；for in主要用于对象属性遍历；for of适合可迭代对象的元素遍历；forEach用于无返回值的遍历操作；while和do while适合未知循环次数的场景；some和every分别用于存在性和全量校验。核心区别在于返回值、可控性及遍历目标，其中for in与for of在对象和数组遍历上差异显著。开发者应根据具体需求选择合适方法，兼顾性能与功能实现。

2026-01-21 22:03:51 711

原创 React新手村：一步步掌握前端开发利器Day2

本文介绍了React类组件的常用生命周期方法和事件绑定方式。主要内容包括： React类组件的生命周期：挂载阶段（constructor、componentDidMount、render）、更新阶段（componentDidUpdate）和卸载阶段（componentWillUnmount）的核心方法及其应用场景。 setState的使用方法：介绍了对象式更新和函数式更新两种状态更新方式，并解释了箭头函数返回对象时的语法注意事项。 React事件绑定：对比了原生DOM事件与React事件的差异，介绍了onC

2026-01-21 20:46:37 1294

原创前端基础之HTML

本文介绍了HTML的基础知识，包括：1）HTML文档的基本结构（DOCTYPE声明、html/head/body标签）；2）常用内容标签（标题、段落、文本样式等）；3）HTML实体字符的使用；4）功能性标签（输入框、图片、超链接等）；5）表单相关标签（文本框、密码框、按钮等）；6）容器标签（div、列表等）。文章通过代码示例详细展示了各标签的用法，适合初学者快速掌握HTML基础。

2026-01-20 23:42:05 945

原创 React新手村：一步步掌握前端开发利器Day1

本文介绍了React框架的核心概念和基础使用方法。作为Facebook开发的前端工具，React凭借虚拟DOM技术、组件化开发和高效的JSX语法成为主流框架。文章详细讲解了React的起源、工作原理和特点，并通过具体代码示例演示了如何搭建React环境、使用JSX语法实现数据绑定和页面渲染。初学者可以通过本文了解React的基本运行机制，包括虚拟DOM的diff算法、JSX转译过程以及简单的单页面开发流程。这些基础知识为后续深入学习React组件开发、状态管理等高级特性奠定了重要基础。

2026-01-20 21:24:34 1202

2302_81469245的博客