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同样…

代码随想录算法训练营第八天| 344. 反转字符串|541. 反转字符串 II

344. 反转字符串 文档讲解&#xff1a;代码随想录 视频讲解&#xff1a;字符串基础操作&#xff01; | LeetCode&#xff1a;344.反转字符串_哔哩哔哩_bilibili 1. 感觉需要用到指针&#xff0c;但不知道咋做。 2. 倒序就是一个交换left,right指针对应指针值的过程。 3. 纠结…

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…

JS中find的用法

在JavaScript中&#xff0c;Array.prototype.find() 是一个数组方法&#xff0c;用于测试数组中的每个元素是否通过由提供的函数实现的测试。一旦找到一个满足条件的元素&#xff0c;该方法会立即返回该元素的值。如果找不到任何元素满足提供的测试函数&#xff0c;则返回undef…

maven引入依赖时莫名报错

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

Python实战:分析产品价格波动的数据探索

在本次数据分析中,我们将使用Python的Pandas、Matplotlib和Seaborn库对产品价格波动进行深入探索。我们将从加载数据开始,一步步进行数据处理和可视化分析。 1. 加载数据 首先,我们从给定的URL加载数据集,并查看数据的前几行,以便了解数据的结构和内容。 import pandas…

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 …

单链表 c语言

不一定对&#xff0c;仅供参考 在单链表中开始理解错误的地方 这两个并不等价&#xff0c;前者用于后移&#xff0c;后者会破坏链表结构 list list->next; list->next list->next->next; #include <stdio.h> #include <stdlib.h> typedef st…

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"…

【problems】解决·[22001][1138] Data truncation: Invalid use of NULL value.

前言 在数据库管理与维护的过程中&#xff0c;为了保证数据的完整性和一致性&#xff0c;我们常常需要对表结构进行优化&#xff0c;比如将某些列设置为不允许NULL值&#xff08;NOT NULL&#xff09;。然而&#xff0c;如果目标列中已存在NULL值&#xff0c;直接修改将会遇到…

ssh 两次跳转,通过跳板机直接登录设备

在本机的~/.ssh/config文件中添加下面内容: #跳板机ip Host env-1HostName 192.xx.x.xUser user#设备ip Host nv-5HostName 10.xxx.x.xUser rootProxyJump env-1将本机~/.ssh/id_rsa.pub中的公钥拷贝到user192.xx.x.xx的~/.ssh/authorized_keys中; 将本机~/.ssh/id_rsa.pub中…

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的增加或者删除某个对象…

C语言中数组和指针的关系

在C语言中&#xff0c;数组和指针之间存在着密切的关系&#xff0c;尽管它们在概念上是不同的。以下是关于C语言中数组和指针关系的一些要点&#xff1a; 数组名作为指针&#xff1a; 在大多数情况下&#xff0c;数组名在表达式中会被当作指向其第一个元素的指针。例如&#x…

【无标题】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;没配错…

搜索与图论:所有可达路径(DFS算法)

搜索与图论&#xff1a;所有可达路径&#xff08;DFS算法&#xff09; 题目描述参考代码邻接表方法邻接矩阵方法 题目描述 题目描述 给定一个有 n 个节点的有向无环图&#xff0c;节点编号从 1 到 n。请编写一个函数&#xff0c;找出并返回所有从节点 1 到节点 n 的路径。每条…

【BeX5】知识中心

Grid组件修改行选中颜色 .x-state-highlight, .x-grid-widget-content .x-state-highlight, .x-grid-widget-header .x-state-highlight {background: yellow; }