Week 1JavaScript Fundamentals & Functional Concepts
### 💻 核心知识点:JavaScript 基础与函数式编程入门 本周开始构建 JavaScript 基础。课程聚焦函数式编程范式(Functional Programming),这与 CSSE1001 中的 OOP 思维有很大不同。 - **核心概念**: JavaScript syntax, let/const/var, arrow functions, first-class functions, higher-order functions (map, filter, reduce), immutability, pure functions, side effects ⏰ **本周节奏**: 难度 ⭐⭐ | 预计投入 8h(Lecture 2h + Practical 2h + 自学 2h + 编程练习 2h) 🎯 **考试关联**: 函数式编程核心概念(pure function、immutability)是考试基础 🧪 **Practical**: 用 map/filter/reduce 处理数组数据,对比 imperative vs functional 写法 📌 **作业关联**: 所有 assignments 都用 JavaScript,本周是基础 ⚠️ **易错点**: var 的 hoisting 和 scope 问题;箭头函数没有自己的 this;忘记 const 对象的属性仍可修改 (数据来源:2025 Course Profile + UQ Handbook)
JavaScript sy
💡 学习提示
• 请详细解释 COMP2140 中 "JavaScript Fundamentals & Functional Concepts" 的核心概念
• JavaScript Fundamentals & Functional Concepts 的常见考题有哪些?如何准备?
• JavaScript Fundamentals & Functional Concepts 在实际工作中有哪些应用场景?
Week 2Closures, Scope & Advanced Functions
### 💻 核心知识点:闭包、作用域与高级函数 本周深入 JavaScript 的核心机制:闭包(Closure)和作用域链。这是理解 JS 框架内部工作原理的关键。 - **核心概念**: Lexical scope, closure (函数 + 词法环境), IIFE (Immediately Invoked Function Expression), currying, partial application, function composition, module pattern ⏰ **本周节奏**: 难度 ⭐⭐⭐ | 预计投入 9h(Lecture 2h + Practical 2h + 自学 3h + 编程练习 2h) 🎯 **考试关联**: Closure 的行为分析(给定代码预测输出)是高频考题 🧪 **Practical**: 实现 curry 函数、compose 函数;用 closure 实现 counter 和 memoization 📌 **作业关联**: Assignment 1 通常会用到 closure 和 higher-order functions ⚠️ **易错点**: 循环中的 closure 陷阱(经典 setTimeout + var 问题);混淆 closure 中变量的引用 vs 值 (数据来源:2025 Course Profile + UQ Handbook)
Lexical scopeclosure (函数 + 词法环境)IIFE (Immediately I
💡 学习提示
• 请详细解释 COMP2140 中 "Closures, Scope & Advanced Functions" 的核心概念
• Closures, Scope & Advanced Functions 的常见考题有哪些?如何准备?
• Closures, Scope & Advanced Functions 在实际工作中有哪些应用场景?
Week 3Promises, Async/Await & Event Loop
### ⚡ 核心知识点:异步编程与事件循环 本周学习 JavaScript 异步编程模型。理解 Event Loop 是写好 JS 的关键 — 从 callback hell 到 Promise 到 async/await 的演进。 - **核心概念**: Callback functions, callback hell, Promise (pending/fulfilled/rejected), Promise chaining (.then/.catch/.finally), async/await syntax, Event Loop (call stack, task queue, microtask queue), fetch API ⏰ **本周节奏**: 难度 ⭐⭐⭐⭐ | 预计投入 10h(Lecture 2h + Practical 2h + 自学 4h + 编程练习 2h)🔥 难度跳升 🎯 **考试关联**: Event Loop 的执行顺序分析(给定代码预测 console.log 顺序)是经典考题 🧪 **Practical**: 用 fetch + async/await 调用 REST API,处理成功/错误情况;分析 Event Loop 执行顺序 📌 **作业关联**: 后续项目中的 API 调用都需要异步编程 ⚠️ **易错点**: async 函数返回 Promise(不是直接值);忘记 await 导致拿到 Promise 对象而非数据;Promise.all 中一个 reject 全部失败 (数据来源:2025 Course Profile + UQ Handbook)
Callback fu
💡 学习提示
• 请详细解释 COMP2140 中 "Promises, Async/Await & Event Loop" 的核心概念
• Promises, Async/Await & Event Loop 的常见考题有哪些?如何准备?
• Promises, Async/Await & Event Loop 在实际工作中有哪些应用场景?
Week 4DOM Manipulation & Browser Events
### 🌐 核心知识点:DOM 操作与浏览器事件 本周学习 JavaScript 与浏览器交互的核心机制 — DOM API 和事件处理。这是前端开发的基础。 - **核心概念**: Document Object Model (DOM tree), querySelector/querySelectorAll, createElement/appendChild, event listeners (addEventListener), event bubbling/capturing, event delegation, DOM diffing concept ⏰ **本周节奏**: 难度 ⭐⭐⭐ | 预计投入 9h(Lecture 2h + Practical 2h + 自学 3h + 编程练习 2h) 🎯 **考试关联**: Event bubbling/capturing 的执行顺序和 DOM 操作方法是常考内容 🧪 **Practical**: 用原生 JS 实现一个交互式 Todo List(CRUD + event delegation) 📌 **作业关联**: 理解 DOM 操作后才能理解 React 的 Virtual DOM 优化 ⚠️ **易错点**: innerHTML 赋值会清除所有子元素的事件监听器;频繁 DOM 操作导致性能问题(reflow/repaint) (数据来源:2025 Course Profile + UQ Handbook)
Docume
💡 学习提示
• 请详细解释 COMP2140 中 "DOM Manipulation & Browser Events" 的核心概念
• DOM Manipulation & Browser Events 的常见考题有哪些?如何准备?
• DOM Manipulation & Browser Events 在实际工作中有哪些应用场景?
Week 5React Fundamentals: Components & JSX
### ⚛️ 核心知识点:React 基础 — 组件与 JSX 本周开始学习 React — 目前最流行的 UI 框架。从原生 DOM 操作过渡到声明式 UI,理解组件化思维。 - **核心概念**: React components (function components), JSX syntax, props, component composition, React.createElement under the hood, Create React App / Vite setup, conditional rendering ⏰ **本周节奏**: 难度 ⭐⭐⭐ | 预计投入 9h(Lecture 2h + Practical 2h + 自学 3h + React 项目搭建 2h) 🎯 **考试关联**: JSX 转换为 JavaScript 的过程、props 传递机制是考试重点 🧪 **Practical**: 用 React 重构之前的 Todo List,体会声明式 vs 命令式的区别 📌 **作业关联**: Project/Assignment 通常要求用 React 构建完整应用 ⚠️ **易错点**: JSX 不是 HTML — className 而非 class,htmlFor 而非 for;忘记 key prop 导致列表渲染 bug (数据来源:2025 Course Profile + UQ Handbook)
React compo
💡 学习提示
• 请详细解释 COMP2140 中 "React Fundamentals: Components & JSX" 的核心概念
• React Fundamentals: Components & JSX 的常见考题有哪些?如何准备?
• React Fundamentals: Components & JSX 在实际工作中有哪些应用场景?
Week 6React State Management: useState & useEffect
### ⚛️ 核心知识点:React 状态管理 本周学习 React Hooks — 现代 React 的核心机制。useState 管理组件内部状态,useEffect 处理副作用。 - **核心概念**: useState hook (state, setState, functional update), useEffect hook (dependency array, cleanup function), lifting state up, controlled components (forms), React rendering cycle ⏰ **本周节奏**: 难度 ⭐⭐⭐⭐ | 预计投入 10h(Lecture 2h + Practical 2h + 自学 4h + 项目开发 2h)🔥 核心周 🎯 **考试关联**: useEffect 的 dependency array 行为和 re-render 触发条件是高频考点 🧪 **Practical**: 实现带搜索/过滤功能的列表应用,练习 state 管理和 controlled input 📌 **作业关联**: 项目中的所有交互功能都依赖 state 管理 ⚠️ **易错点**: useEffect 空依赖数组 [] 只执行一次(mount);忘记 cleanup 函数导致内存泄漏;直接修改 state 对象(mutation)而非创建新对象 (数据来源:2025 Course Profile + UQ Handbook)
useState hook (statesetStatefu
💡 学习提示
• 请详细解释 COMP2140 中 "React State Management: useState & useEffect" 的核心概念
• React State Management: useState & useEffect 的常见考题有哪些?如何准备?
• React State Management: useState & useEffect 在实际工作中有哪些应用场景?
Week 7React Router & Single Page Applications
### 🔀 核心知识点:路由与单页面应用 本周学习 React Router 实现 SPA(Single Page Application)。理解客户端路由 vs 服务端路由的区别。 - **核心概念**: React Router (BrowserRouter, Route, Link, useNavigate, useParams), SPA vs MPA, client-side routing, nested routes, URL parameters, programmatic navigation ⏰ **本周节奏**: 难度 ⭐⭐⭐ | 预计投入 9h(Lecture 2h + Practical 2h + 自学 3h + 项目路由搭建 2h) 🎯 **考试关联**: SPA 的工作原理和 React Router 的使用模式可能考概念题 🧪 **Practical**: 为项目添加多页面路由(首页、详情页、关于页),实现 URL 参数传递 📌 **作业关联**: 项目需要多页面结构,本周建立路由框架 ⚠️ **易错点**: 刷新 SPA 页面得到 404(需要服务端配置 fallback);useNavigate 在非 Router 组件内调用报错 (数据来源:2025 Course Profile + UQ Handbook)
React Router (BrowserRouterRouteLi
💡 学习提示
• 请详细解释 COMP2140 中 "React Router & Single Page Applications" 的核心概念
• React Router & Single Page Applications 的常见考题有哪些?如何准备?
• React Router & Single Page Applications 在实际工作中有哪些应用场景?
Week 8API Integration & Data Fetching
### 🔌 核心知识点:API 集成与数据获取 本周学习 React 应用如何与后端 API 交互。结合之前的 async/await 知识,在 React 中正确地获取和管理远程数据。 - **核心概念**: fetch/axios in React, useEffect for data fetching, loading/error states, REST API patterns (GET/POST/PUT/DELETE), JSON handling, CORS basics, custom hooks (useFetch) ⏰ **本周节奏**: 难度 ⭐⭐⭐⭐ | 预计投入 10h(Lecture 2h + Practical 2h + 自学 3h + API 集成 3h) 🎯 **考试关联**: React 中 data fetching 的正确模式(useEffect + 清理)是考试重点 🧪 **Practical**: 对接公开 REST API(如天气/电影数据库),实现搜索、列表展示、详情查看 📌 **作业关联**: 项目中的动态数据必须通过 API 获取 ⚠️ **易错点**: useEffect 中 async 函数不能直接作为 effect(需要内部包一层);竞态条件(rapid navigation 导致过时的 fetch 结果覆盖最新数据) (数据来源:2025 Course Profile + UQ Handbook)
fetch/axios i
💡 学习提示
• 请详细解释 COMP2140 中 "API Integration & Data Fetching" 的核心概念
• API Integration & Data Fetching 的常见考题有哪些?如何准备?
• API Integration & Data Fetching 在实际工作中有哪些应用场景?
Week 9React Native & Cross-Platform Development
### 📱 核心知识点:React Native 跨平台开发 本周进入 React Native — 用 JavaScript 构建原生移动应用。体会 "Learn once, write anywhere" 的哲学。 - **核心概念**: React Native vs React (View/Text/ScrollView vs div/span), StyleSheet API, Expo framework, platform-specific code, React Native navigation (Stack/Tab), mobile UI patterns ⏰ **本周节奏**: 难度 ⭐⭐⭐⭐ | 预计投入 10h(Lecture 2h + Practical 2h + 自学 3h + RN 项目搭建 3h)🔥 新工具链 🎯 **考试关联**: React vs React Native 的差异对比是常考概念题 🧪 **Practical**: 用 Expo 搭建 React Native 项目,实现基本的列表页面 + 详情页面导航 📌 **作业关联**: 后续项目可能要求 web + mobile 双端实现 ⚠️ **易错点**: RN 没有 CSS — 用 StyleSheet.create;Flexbox 默认方向是 column(不是 row);Expo 和 bare RN 的差异 (数据来源:2025 Course Profile + UQ Handbook)
React Native vs React (View/Text/ScrollView vs div/spa
💡 学习提示
• 请详细解释 COMP2140 中 "React Native & Cross-Platform Development" 的核心概念
• React Native & Cross-Platform Development 的常见考题有哪些?如何准备?
• React Native & Cross-Platform Development 在实际工作中有哪些应用场景?
Week 10Cross-Platform Architecture & State Sharing
### 🔄 核心知识点:跨平台架构与状态共享 本周深入跨平台开发的架构挑战:如何在 Web 和 Mobile 间共享代码和状态。 - **核心概念**: Shared business logic, platform-specific UI, React Context API for global state, useReducer pattern, monorepo structure, code sharing strategies between web and native ⏰ **本周节奏**: 难度 ⭐⭐⭐⭐ | 预计投入 10h(Lecture 2h + Practical 2h + 自学 3h + 项目开发 3h) 🎯 **考试关联**: Context API 的使用模式和跨平台架构选择是可能的考点 🧪 **Practical**: 用 Context API + useReducer 实现全局状态管理(如 auth state, theme) 📌 **作业关联**: 项目的状态管理架构在本周确定 ⚠️ **易错点**: Context 导致不必要的 re-render(所有 consumer 都会重渲染);useReducer 的 dispatch 是异步的 (数据来源:2025 Course Profile + UQ Handbook)
Shared busi
💡 学习提示
• 请详细解释 COMP2140 中 "Cross-Platform Architecture & State Sharing" 的核心概念
• Cross-Platform Architecture & State Sharing 的常见考题有哪些?如何准备?
• Cross-Platform Architecture & State Sharing 在实际工作中有哪些应用场景?
Week 11Testing & Quality Assurance
### 🧪 核心知识点:测试与质量保障 本周学习前端测试策略。写测试不是额外负担,而是保证代码质量和支持重构的关键。 - **核心概念**: Testing pyramid (unit/integration/e2e), Jest testing framework, React Testing Library, component testing (render, fireEvent, screen), snapshot testing, mocking API calls, test coverage ⏰ **本周节奏**: 难度 ⭐⭐⭐ | 预计投入 9h(Lecture 2h + Practical 2h + 自学 3h + 为项目写测试 2h) 🎯 **考试关联**: 测试策略选择和 Testing Library 的 query 方法是可能考点 🧪 **Practical**: 为之前的 React 组件写单元测试;mock API 调用测试 data fetching 逻辑 📌 **作业关联**: 最终项目可能要求包含测试覆盖率 ⚠️ **易错点**: snapshot 测试太脆弱(一点 UI 变动就 break);测试 implementation details 而非 behavior 导致维护成本高 (数据来源:2025 Course Profile + UQ Handbook)
Testi
💡 学习提示
• 请详细解释 COMP2140 中 "Testing & Quality Assurance" 的核心概念
• Testing & Quality Assurance 的常见考题有哪些?如何准备?
• Testing & Quality Assurance 在实际工作中有哪些应用场景?
Week 12Project Polish, Deployment & Review
### 🚀 核心知识点:项目优化、部署与课程回顾 最后一周完成项目的优化、部署和最终提交。回顾 JavaScript 函数式编程到 React/React Native 跨平台开发的完整旅程。 - **核心概念**: Performance optimization (React.memo, useMemo, useCallback), deployment (Vercel/Netlify for web, Expo for mobile), code review best practices, accessibility (a11y), responsive design ⏰ **本周节奏**: 难度 ⭐⭐⭐⭐ | 预计投入 12h(Lecture 2h + Practical 2h + 项目最终提交 8h)🔥 Final Project Due 🎯 **考试关联**: 性能优化 hooks 的使用场景和 deployment 流程可能出考题 🧪 **Practical**: 项目 demo 展示 + code review session 📌 **作业关联**: 最终项目提交截止 — 确保 web + mobile 都能正常运行 ⚠️ **易错点**: 过早优化(先让功能正确,再考虑性能);部署前忘记环境变量配置;mobile 端不同屏幕尺寸适配 (数据来源:2025 Course Profile + UQ Handbook)
Performa
💡 学习提示
• 请详细解释 COMP2140 中 "Project Polish, Deployment & Review" 的核心概念
• Project Polish, Deployment & Review 的常见考题有哪些?如何准备?
• Project Polish, Deployment & Review 在实际工作中有哪些应用场景?