从0开始学习前端 第二十课：JavaScript入门

第二十课：JavaScript入门

学习目标

在本课程结束时，你将能够：

1. 理解并书写JavaScript注释。
2. 了解并声明不同数据类型的变量。
3. 使用并理解JavaScript中常用的赋值、算术和比较运算符。

学习内容

1. 注释

   • 概念: 在JavaScript中，注释用于解释代码的作用，增加可读性，有助于他人（或未来的你）理解代码的意图。注释还可以用于临时禁用代码，以便调试。
   • 代码示例:

     // 这是单行注释，它解释了下面的代码行将会做什么事情
     
     /* 这是多行注释的开始
     你可以在这里写多行文本
     这些文本不会被JavaScript执行
     这是多行注释的结束 */
     

   • 预计输出效果: 注释不会在浏览器的控制台中产生任何输出，因为它们不是可执行代码。

2. 变量声明与数据类型

   • 概念: 变量是存储信息的容器。在JavaScript中，可以使用var, let, 或 const关键字来声明变量。常见的数据类型包括：字符串(String)、数字(Number)和布尔值(Boolean)。
   • 代码示例:

     let message = "Hello, World!"; // 字符串类型
     const PI = 3.14159; // 数字类型，常量声明
     var isLearning = true; // 布尔类型
     

   • 预计输出效果: 如果你使用console.log(variableName);来打印这些变量，你将在控制台看到相应的值输出。

3. 运算符

   • 赋值运算符: 用于给变量赋值。
     • 代码示例:

       let x = 5; // 将5赋值给x
       

   • 算术运算符: 用于执行变量和/或值之间的算术计算。
     • 代码示例:

       let sum = x + 2; // 结果为7
       let product = x * 3; // 结果为15
       

     • 预计输出效果: console.log(sum); 将输出7，console.log(product); 将输出15。
   • 比较运算符: 用于比较两个值，并返回布尔值表明比较结果。
     • 代码示例:

       let isEqual = (x === 5); // 结果为true
       let isGreater = (x > 3); // 结果为true
       

     • 预计输出效果: console.log(isEqual); 将输出true，console.log(isGreater); 将输出true。

课后练习

1. 编写注释: 找到一段代码，对其每一行添加说明性的单行或多行注释。
2. 声明变量:
   • 声明一个字符串类型的变量myFavoriteColor并赋值为你最喜欢的颜色。
   • 声明一个数字类型的变量numberOfPets并赋值为你拥有的宠物数量。
   • 声明一个布尔类型的变量doILikePizza并根据你是否喜欢披萨赋值为true或false。
   • 使用console.log打印出上述每个变量的值。
3. 使用运算符:
   • 声明两个变量a和b，分别赋值为10和3。
   • 使用算术运算符计算并打印a和b的和、差、积、商及余数。
   • 检查变量a是否大于b，并使用console.log输出结果。

课后练习解析

1. 注释编写: 具体代码取决于你选择的代码段。关键是确保注释准确反映了代码的功能和目的。
2. 声明变量:
   • 示例代码：

     let myFavoriteColor = "blue";
     let numberOfPets = 2;
     let doILikePizza = true;
     
     console.log(myFavoriteColor); // 输出: blue
     console.log(numberOfPets); // 输出: 2
     console.log(doILikePizza); // 输出: true
     

3. 使用运算符:
   • 示例代码：

     let a = 10;
     let b = 3;
     
     console.log(a + b); // 输出: 13
     console.log(a - b); // 输出: 7
     console.log(a * b); // 输出: 30
     console.log(a / b); // 输出: 3.3333333333333335
     console.log(a % b); // 输出: 1
     
     console.log(a > b); // 输出: true
     

   通过这些练习，你将加深对JavaScript注释、变量声明、数据类型和基本运算符的理解。记住，编程是一项实践技能，所以多写代码，遇到问题时查找资料或询问他人也是很重要的学习过程。

章节目录
第二十一课：控制结构 - 条件语句与循环