JavaScript前端开发从入门到精通
文章平均质量分 71
前言:JavaScript能做什么?
打开淘宝看到轮播图在自动切换、点击按钮弹出提示、页面无刷新加载新内容——这些都是JavaScript在背后默默工作。
JavaScript是网页的“大脑“,负责所有交互逻辑。
川冰ICE
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
JavaScript进阶②|Proxy与Reflect,元编程入门
Proxy(代理)可以对目标对象进行拦截和自定义操作。Reflect(反射)提供了访问对象的标准方法,与 Proxy 的拦截器一一对应。Vue 3 的响应式系统就是基于 Proxy 实现的。原创 2026-06-03 09:46:30 · 221 阅读 · 0 评论 -
JavaScript进阶①|迭代器与生成器,手写可迭代对象
本文深入讲解JavaScript中的迭代器与生成器机制。首先介绍了可迭代对象(Iterable)的概念,即实现了[Symbol.iterator]方法的对象,如数组、字符串等内置对象。随后通过手写实现一个可迭代对象,演示了自定义迭代逻辑的原理。文章重点解析生成器(Generator)的特性,包括yield传值、yield*委托等高级用法,并通过模拟async/await展示了生成器处理异步的能力。最后提供两个实战案例:自定义范围迭代器和生成器版异步任务队列,帮助开发者深入理解这些概念的实际应用。适合已经掌握原创 2026-06-03 09:45:51 · 89 阅读 · 0 评论 -
JavaScript入门⑩|BOM与浏览器对象,localStorage_位置_历史记录
本文介绍了JavaScript中的BOM(浏览器对象模型)核心概念,包括window、navigator、location、history等对象的使用方法。重点讲解了localStorage和sessionStorage的存储机制与区别,以及如何通过它们实现持久化数据存储和跨标签页通信。文章还提供了URL参数解析、浏览器历史记录管理、定时器控制等实用技巧,并通过一个用户偏好设置存储的实战案例展示了BOM在前端开发中的实际应用。适合已掌握DOM操作、想进一步了解浏览器对象模型的开发者学习参考。原创 2026-05-25 23:15:51 · 387 阅读 · 0 评论 -
JavaScript入门⑨|Fetch与AJAX,浏览器网络请求一篇搞懂
本文介绍了浏览器端发起网络请求的两种主要方式:传统的XMLHttpRequest(XHR)和现代的Fetch API。详细讲解了Fetch的基本用法,包括GET、POST、PUT、DELETE请求的实现,以及如何处理JSON、文本、Blob等不同格式的响应数据。文章还提供了async/await封装Fetch的实用示例,并对比了XHR与Fetch的优缺点。适合掌握异步编程基础、需要实现前后端数据交互的前端开发者学习参考。原创 2026-05-25 23:15:36 · 206 阅读 · 0 评论 -
开源入门踩坑实录:新手必避的10个坑,每个都让我熬到凌晨三点
阶段关键动作对应避坑准备期配置正确的Git个人信息坑一选项目从文档/翻译入手,选有good-first-issue标签的项目坑九动手前通读 README → CONTRIBUTING → LICENSE坑四、坑十写代码从功能分支开发,遵循Conventional Commits坑二、坑三提PR单一职责、小体积、清晰的描述坑七沟通中专业礼貌,维护者说什么先听着坑八遇问题Issue写清复现步骤和环境信息坑六学技巧用浅克隆和sparse-checkout省空间坑五开源不是大神的专属游戏。原创 2026-05-24 15:14:11 · 602 阅读 · 0 评论 -
JavaScript入门⑧|Promise与async_await,彻底搞懂异步编程
本文介绍了JavaScript异步编程的核心概念,重点讲解了Promise和async/await的使用方法。首先通过同步与异步的对比,说明异步编程的必要性。然后分析回调函数的缺陷,引出Promise解决方案,详细讲解Promise的创建、状态转换以及then/catch/finally链式调用。接着介绍Promise.all、Promise.race等静态方法的实际应用。最后深入讲解async/await语法,通过串行与并行请求的对比示例,展示如何用同步写法处理异步操作,并提供了完整的错误处理方案。文章适原创 2026-05-24 10:49:57 · 208 阅读 · 0 评论 -
JavaScript入门⑦|ES6核心知识速查,let_const_模板字符串_解构赋值
本文系统介绍了ES6核心知识点,包括let/const声明、模板字符串、解构赋值、展开运算符和对象增强特性。let/const提供了块级作用域和常量声明;模板字符串支持表达式和多行文本;解构赋值可简化数组/对象取值;展开运算符便于合并/复制数据;对象增强包括属性/方法简写等。文章通过代码示例演示了这些特性的实际应用,最后展示了如何利用这些知识实现配置合并功能。这些ES6特性是现代JavaScript开发的必备技能,能显著提升代码可读性和开发效率。原创 2026-05-24 10:46:49 · 248 阅读 · 0 评论 -
JavaScript入门⑥|DOM操作详解,网页的增删改查全在这里了
本文详细介绍了JavaScript中的DOM操作,包括获取元素、修改内容与属性、创建与删除元素以及事件绑定等核心功能。通过getElementById、querySelector等方法可以精准定位页面元素,使用textContent、innerHTML等属性可安全修改内容。文章还讲解了classList和style操作技巧,以及创建、插入和删除元素的方法。最后重点介绍了推荐的事件绑定方式addEventListener,列举了常见事件类型及事件对象的使用。这些DOM操作是前端开发的基础,适合掌握JS基础想操原创 2026-05-23 07:25:11 · 339 阅读 · 0 评论 -
JavaScript入门⑤|数组方法全攻略,map/filter/reduce三剑客
本文全面介绍了JavaScript数组的核心方法,重点讲解了map、filter、reduce这"三剑客"的用法。文章从数组创建开始,详细分类讲解了遍历类(forEach/map/filter)、查询类(find/includes/some)、聚合类(reduce/flat)等方法,并提供了丰富的代码示例。特别强调了reduce方法的强大功能,展示了求和、求最大值、数组去重、对象统计等实用场景。最后还介绍了排序与反转操作,并附上了常用数组方法的对比表格,帮助开发者快速掌握数组处理技巧。原创 2026-05-23 07:24:45 · 187 阅读 · 0 评论 -
JavaScript入门④|函数详解,函数声明与箭头函数的区别
这篇文章详细介绍了JavaScript函数的四种声明方式(函数声明、函数表达式、箭头函数及其简写形式),重点讲解了箭头函数的特性(无this绑定、无arguments对象)和使用场景。文章对比了函数提升现象,解析了参数处理技巧(默认参数、剩余参数、解构参数),并通过购物车计算实例演示高阶函数应用(map/filter/reduce等)。最后提供了实战练习题,帮助读者掌握函数封装和数组处理方法。适合有一定JS基础、想提升代码封装能力的学习者。原创 2026-05-22 10:35:13 · 281 阅读 · 0 评论 -
JavaScript入门③|运算符与流程控制,让代码做出判断和循环
本文介绍了JavaScript中的运算符和流程控制,包括算术、比较、逻辑运算符,以及if/else、switch条件判断和for/while循环结构。重点讲解了===严格相等判断、三元运算符、循环控制语句break/continue的使用,并通过ATM模拟器案例展示了综合应用。适合刚学完变量和数据类型的初学者掌握程序的基本判断和循环能力。原创 2026-05-21 13:35:36 · 196 阅读 · 0 评论 -
JavaScript入门②|变量与数据类型详解,一文搞懂let_const_var
本文详细介绍了JavaScript中的变量声明与数据类型。主要内容包括:1)三种变量声明方式(let/const/var)的区别与使用场景,推荐优先使用const;2)JavaScript的八大数据类型(数值、字符串、布尔值、空值、数组、对象、Symbol、BigInt);3)typeof运算符的使用方法;4)数据类型转换技巧;5)通过简易计算器实例演示变量与数据类型的实际应用。文章还提供了知识卡片总结和课后练习,适合前端初学者系统学习JavaScript变量系统。原创 2026-05-21 13:35:16 · 34 阅读 · 0 评论 -
JavaScript入门①|三行代码写出第一个交互网页,新手必看!
这篇文章介绍了JavaScript的基础入门知识,适合零基础学习者。主要内容包括: JavaScript的作用:控制网页交互逻辑 开发环境准备:使用浏览器控制台即可编写JS代码 基础语法示例:console.log、alert、prompt等基本用法 实战演示:通过一个简单HTML页面展示JS如何修改网页内容 核心概念速查表 课后练习任务 文章采用直观的代码示例和通俗易懂的讲解方式,帮助新手快速理解JavaScript的基本功能和用法,并提供了动手实践的指导。原创 2026-05-21 13:34:58 · 200 阅读 · 0 评论
分享