JavaScript快速入门系列-2(JavaScript语言基础)

第二章:JavaScript语言基础

    • 2.1 变量声明:`let`, `const`, `var`
      • 2.1.1 变量是什么?
      • 2.1.2 `var`
      • 2.1.3 `let`与`const`
      • 2.1.4 选择哪个关键字?
    • 2.2 数据类型
      • 2.2.1 基本数据类型
      • 2.2.2 复杂数据类型
      • 2.2.3 示例与类型检测
    • 2.3 运算符
      • 2.3.1 算术运算符
      • 2.3.2 比较运算符
      • 2.3.3 逻辑运算符
      • 2.3.4 赋值运算符
      • 2.3.5 例子
    • 2.4 控制结构
      • 2.4.1 if...else
      • 2.4.2 switch
      • 2.4.3 for循环
      • 2.4.4 while和do...while

开篇图

在这一章节中,我们将深入探索JavaScript的基石——语言基础。从变量声明到数据类型的掌握,再到运算符和控制结构的运用,你将逐步构建起对这门动态语言的坚实理解。让我们一起启程,踏入JavaScript的奇妙世界。

2.1 变量声明:let, const, var

2.1.1 变量是什么?

在编程中,变量就像是一个可以存放数据的容器。你可以把它想象成一个标签,贴在一个盒子上,盒子里面可以放任何东西——数字、字符串、甚至复杂的对象和数组。在JavaScript中,我们使用关键字来声明这些变量。

2.1.2 var

早期的JavaScript中,var是最常用的变量声明方式,但它有一些特殊的规则,比如变量提升(hoisting)和函数作用域/全局作用域的限制,这可能会导致一些意料之外的行为。

console.log(x); // 输出undefined,因为var声明会被提升
var x = 5;

2.1.3 letconst

ES6引入了letconst,为变量声明带来了新的维度。let允许你在块级作用域内声明变量,而const则是用来声明那些一旦赋值就不应该改变的常量。

{let y = 10;console.log(y); // 输出10
}
// console.log(y); // 这里会报错,因为y只在上面的块级作用域内有效const PI = 3.14; // 声明一个常量
PI = 3; // 错误!尝试修改常量会引发错误

2.1.4 选择哪个关键字?

  • let:当你需要一个在特定块内可变的值。
  • const:用于不会改变的值,如数学常量或对象引用(虽然对象本身可变)。
  • var:尽量避免使用,除非处理旧代码或有特殊需求。

2.2 数据类型

JavaScript是一种弱类型语言,它会根据上下文自动推断变量的类型。主要的数据类型包括:

2.2.1 基本数据类型

  • 字符串 (string):文本信息,用单引号(’ ')或双引号(" ")包围。
  • 数字 (number):整数或浮点数。
  • 布尔值 (boolean):真(true)或假(false)。
  • null:表示一个空对象指针。
  • undefined:表示变量已被声明但未被初始化。
  • Symbol (ES6新增):独一无二的值,常用于对象的键。

2.2.2 复杂数据类型

  • 对象 (object):无序的属性集合。
  • 数组 (array):有序的元素集合,元素可以是任意类型。
  • Function:JavaScript的一等公民,可以作为其他变量的值。

2.2.3 示例与类型检测

let name = "Alice"; // 字符串
let age = 25; // 数字
let isStudent = true; // 布尔值
let empty = null; // null
let undefinedVar; // undefinedconsole.log(typeof name); // "string"
console.log(typeof age); // "number"
console.log(typeof isStudent); // "boolean"
console.log(typeof empty); // "object" - 注意这个特殊的类型检测结果
console.log(typeof undefinedVar); // "undefined"let person = {name: "Bob", age: 30}; // 对象
let friends = ["Alice", "Charlie"]; // 数组
let greet = function() { console.log("Hello"); }; // 函数console.log(Array.isArray(friends)); // true
console.log(friends instanceof Array); // true

2.3 运算符

2.3.1 算术运算符

包括加+、减-、乘*、除/、取余%等基本运算。

2.3.2 比较运算符

如等于==(类型转换)、严格等于===(不进行类型转换)、不等于!=、严格不等于!==、大于>、小于<等。

2.3.3 逻辑运算符

包括与&&、或||、非!。逻辑运算符常用于条件判断中。

2.3.4 赋值运算符

除了基本的=外,还有复合赋值运算符,如+=, -=, *=, /=, %=, 等。

2.3.5 例子

let x = 10;
let y = 5;let sum = x + y; // 算术运算
console.log(sum); // 15let isEqual = x === y; // 严格等于
console.log(isEqual); // falselet isGreater = x > y; // 比较运算
console.log(isGreater); // truelet result = (x > 0) && (y < 10); // 逻辑与
console.log(result); // truex += 2; // 复合赋值
console.log(x); // 12

2.4 控制结构

2.4.1 if…else

基于条件执行不同的代码块。

let score = 85;if(score >= 90){console.log("优秀");
} else if(score >= 80){console.log("良好");
} else {console.log("加油");
}

2.4.2 switch

多分支选择结构,基于不同的情况执行代码。

let day = "Monday";switch(day){case "Monday":console.log("新的一周开始了!");break;case "Friday":console.log("马上周末了!");break;default:console.log("继续努力工作!");
}

2.4.3 for循环

重复执行一段代码直到满足终止条件。

for(let i = 0; i < 5; i++){console.log(i);
}

2.4.4 while和do…while

while在条件为真时执行循环体,do...while至少执行一次循环体,然后检查条件。

let count = 0;while(count < 3){console.log(count);count++;
}do {console.log(count);count++;
} while(count < 5);

结前图

通过这一章节的学习,你已经掌握了JavaScript的基础构造块。从变量声明到数据类型,再到运算符和控制结构的运用,这些知识是构建复杂程序的基石。接下来,我们将利用这些基础,探索更高级的函数、对象操作,以及如何与浏览器交互,敬请期待!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/26561.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

CATIA P3 V5-6R 中文版软件下载安装 达索CATIA三维设计软件获取

CATIA的建模和装配能力堪称业界翘楚。其强大的建模工具能够轻松应对各种复杂的几何形状和结构&#xff0c;帮助设计师们快速构建出精准的产品模型。同时&#xff0c;装配模块则能够实现零部件的快速装配&#xff0c;大大提高了设计效率。 在分析和仿真方面&#xff0c;CATIA同样…

tkinter文本对齐方式

tkinter文本对齐方式 文本对齐方式效果代码 文本对齐方式 左对齐&#xff08;left&#xff09;&#xff1a;默认对齐方式&#xff0c;文本从左边界开始。右对齐&#xff08;right&#xff09;&#xff1a;文本从右边界开始。居中对齐&#xff08;center&#xff09;&#xff1…

IO多路复用简介和代码实例(select函数)

接上篇 阻塞IO、非阻塞IO、IO多路复用和信号驱动IO简介-CSDN博客文章浏览阅读95次。阻塞IO、非阻塞IO、IO多路复用和信号驱动IO简介https://blog.csdn.net/CSDN_DU666666/article/details/139598410?csdn_share_tail%7B%22type%22%3A%22blog%22%2C%22rType%22%3A%22article%2…

maven引入依赖时莫名报错

一般跟依赖的版本无关&#xff0c;会报出 Cannot resolve xxx 的错误。 这种情况下去IDEA的setting中找maven的仓库位置 在仓库中顺着包路径下寻找&#xff0c;可能会找到.lastUpdated 的文件&#xff0c;这样的文件一般是下载失败了&#xff0c;而且在一段时间内不再下载&…

windows环境下配置git环境变量

路由当前目录 vim 打开 .bash_profile PATH$PATH:/d/phpstudy_pro/Extensions/php/php7.4.3nts PATH$PATH:/d/phpstudy_pro/Extensions/php8/php8.2.9nts PATH$PATH:/d/phpstudy_pro/Extensions/composer2.5.8 …

Downie for Mac v4.7.17 在线视频下载软件 安装(简单易学,小白轻松搞定)

Mac分享吧 文章目录 效果一、准备工作二、开始安装1、双击运行软件&#xff0c;将其从左侧拖入右侧文件夹中&#xff0c;等待安装完毕2、应用程序显示软件图标&#xff0c;表示安装成功 三、运行测试1、打开软件&#xff0c;进行设置2、下载视频&#xff0c;测试3、根据需要选…

凡尔码来访登记卡助力来访安全

来访登记制度是指为了加强对来访人员的管理和安全控制&#xff0c;确保组织内部秩序和安全的一项制度。通过来访登记制度&#xff0c;可以对来访人员的身份进行核实&#xff0c;了解来访目的&#xff0c;并采取相应的安全措施&#xff0c;为组织内部的工作和人员安全提供保障。…

登录/注册- 滑动拼图验证码(IOS/Swift)

本章介绍如何使用ios开发出滑动拼图验证码&#xff0c;分别OC代码和swift代码调用 1.导入项目model文件OC代码&#xff08;下载完整Demo&#xff09; 2.放入你需要显示的图片 一&#xff1a;OC调用 #import "ViewController.h" #import "CodeView.h"…

ArrayList浅析

目录 一、ArrayList源码1.1 迭代器1.1.1 Itr源码浅析1.1.2 ListItr源码浅析 1.2 常用方法1.3 System.arraycopy1.4 ArrayList 的创建方式 二、引申问题2.1 ArrayList的大小是如何增加的&#xff1f;2.2 什么情况下你会使用ArrayList2.3 在索引中ArrayList的增加或者删除某个对象…

【无标题】QTday1

#include "mywidget.h"MyWidget::MyWidget(QWidget *parent): QMainWindow(parent) {//设置窗口标题this->setWindowTitle("QQ");//设置窗口图标this->setWindowIcon(QIcon("C:\\Users\\雷特玉\\Desktop\\qq.png"));//设置窗口的背景颜色t…

Springboot(若依)国际化配置接口访问后返回????????

最近使用若依的框架进行二次开发&#xff0c;配置了国际化&#xff0c;application.yml配置英文时没问题&#xff0c;但配置中文basename: i18n/messages_zh_CN&#xff0c;访问接口就直接返回的???&#xff0c;如图&#xff1a; 于是检查了I18nConfig文件&#xff0c;没配错…

MathWorks的介绍,以及Simscape 的主要特点

MathWorks 是一家美国的软件公司&#xff0c;以其科学计算软件为广泛知名&#xff0c;特别是 MATLAB 和 Simulink。这两款产品广泛用于工程、科学研究、学术界和工业应用中&#xff0c;帮助用户进行数学计算、算法开发、数据可视化、数据分析&#xff0c;以及仿真和模型构建。 …

每日5题Day23 - LeetCode 111 - 115

每一步向前都是向自己的梦想更近一步&#xff0c;坚持不懈&#xff0c;勇往直前&#xff01; 第一题&#xff1a;111. 二叉树的最小深度 - 力扣&#xff08;LeetCode&#xff09; /*** Definition for a binary tree node.* public class TreeNode {* int val;* TreeN…

探索Java 8 Stream API:现代数据处理的新纪元

Stream流 Stream初探&#xff1a;何方神圣&#xff1f; Stream流是一种处理集合数据的高效工具&#xff0c;它可以让你以声明性的方式处理数据集合。Stream不是存储数据的数据结构&#xff0c;而是对数据源&#xff08;如集合、数组&#xff09;的运算操作概念&#xff0c;支…

python绘制散点图

文章目录 1.实验目的2.需求3. 代码以及资源文件4.实验结果 1.实验目的 掌握Python绘图库matplotlib库 2.需求 3. 代码以及资源文件 import numpy as np import matplotlib.pyplot as plt import pandas as pd# 读取NPZ文件 data np.load(../Files/国民经济核算季度数据.npz…

cilium关闭vxlan

说明 操作 启用标志 yum -y install net-tools.x86_64 ifconfig | grep vxlan cilium_vxlan: flags4163<UP,BROADCAST,RUNNING,MULTICAST> mtu 1500修改相关配置 ks get cm cilium-config -oyaml | grep -E tunnel|ipv4-native-routing-cidr|auto-direct-node-routes…

【OceanBase DBA早下班系列】—— 性能问题如何 “拍CT“ (一键获取火焰图和扁鹊图)

1. 前言 最近接连遇到几个客户的环境在排查集群性能问题&#xff0c;总结了一下&#xff0c;直接教大家如何去获取火焰图、扁鹊图&#xff08;调用关系图&#xff09;&#xff0c;直击要害&#xff0c;就像是内脏的疾病去医院看病&#xff0c;上来先照一个CT&#xff0c;通过分…

for循环结构

循环&#xff1a; 循环是一个重复执行一个代码的结构。只要满足循环的条件&#xff0c;会一直执行这个代码。 循环条件&#xff1a;在一定范围之内&#xff0c;按照指定的次数来执行循环。 循环体&#xff1a;在指定的次数内&#xff0c;执行的命令序列。只要条件满足&#…

【iOS】KVC相关总结

目录 1. 什么是KVC&#xff1f;2. 访问对象属性常用方法声明基础使用KeyPath路径多值操作 3. 访问集合属性4. 集合运算符自定义集合运算符 5. 非对象值处理访问基本数据类型访问结构体 6. 属性验证7. 设值和取值原理基本的Getter搜索模式基本的Setter搜索模式NSMutableArray搜索…

Windows本地使用SSH连接VM虚拟机

WIN10 VM17.5 Ubuntu:20.04 1.网路设置 1)选择编辑->更改设置 配置完成 2.修改了服务器文件&#xff0c;修改sshd配置&#xff0c;在此文件下/etc/ssh/sshd_config&#xff0c;以下为比较重要的配置 PasswordAuthentication yes PermitRootLogin yes PubkeyAuthenticat…