本周学习总结:JavaScript 基础与 DOM 操作

一、JavaScript 对象

对象是 JavaScript 的核心数据结构,它以键值对的形式存储数据。不同属性之间用‘,’隔开。例如:

const person={name:'Alice', age:25, greet:function(){console.log(`Hello, I'm ${this.name}`);}};

通过点语法(person.name)或方括号语法(person['age']),可以灵活地访问和修改对象的属性。对象的动态特性让我能够轻松扩展或修改其属性,为数据管理提供了极大的便利。

二、作用域与闭包

作用域决定了变量的可见性。JavaScript 中的let和const提供了块级作用域,避免了变量污染。闭包则是作用域中的一个强大特性,通过闭包,可以创建私有变量和函数:

function createCounter(){let count=0; 

return{increment:()=>count++,get:()=>count};}

constcounter=createCounter();

闭包让我能够封装数据,实现模块化设计,提升了代码的可维护性。

三、DOM 操作:HTML 属性与 CSS 样式

DOM 是前端开发的核心,通过它,可以动态修改网页的结构和样式:

HTML 属性操作

获取属性:element.getAttribute('id')

设置属性:element.setAttribute('class', 'new-class')

移除属性:element.removeAttribute('disabled')

CSS 样式操作

直接修改样式:element.style.color = 'red';

操作类名:element.classList.add('active');

切换类名:element.classList.toggle('hidden');

通过这些方法,可以灵活地控制网页的外观和行为,为用户带来动态的交互体验。

四、学习感悟

本周的学习让我对 JavaScript 的灵活性和强大功能有了更深的认识。对象、作用域和 DOM 操作是前端开发的基础,它们不仅让我能够更好地组织代码,也为实际项目开发提供了坚实的理论支持。

接下来,我计划通过更多的实践项目来巩固这些知识点,同时探索更多高级特性,如异步编程和模块化开发。希望在不断的学习和实践中,能够成为一名更优秀的开发者。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 转载请声明出处 博客原文 随手翻阅以前的学习笔记,顺便整理一下放在这里,方便自己复习,也希望你有也有帮助吧 第一课...
    前端进阶之旅阅读 12,821评论 13 94
  • 第3章 基本概念 3.1 语法 3.2 关键字和保留字 3.3 变量 3.4 数据类型 5种简单数据类型:Unde...
    RickCole阅读 5,288评论 0 21
  • ECMAscript 基础语法 变量 数据类型 运算符 数组 函数 对象 BOM 浏览器对象模型 window对象...
    浅笑_阅读 249评论 0 0
  • JavaScript 浏览器的内核 谷歌浏览器 Webkit内核(v8引擎)Blink火狐浏览器 Gecko内核欧...
    壞忎阅读 288评论 0 0
  • JavaScript 来了 1995年,诞生了JavaScript语言,那一年,我刚刚从大学毕业。在今年RedMo...
    abel_cao阅读 2,053评论 2 54