搜索
首页web前端js教程日期数据类型、变量、运算符、条件语句、Javascript 中的循环

Day  Datatypes, Variables,Operators, Conditional Statements,Looping in Javascript

JavaScript 数据类型:

在 JavaScript 中,数据类型定义了变量可以保存的值的类型。类型决定了可以对该值执行哪些操作。JavaScript 既有原始数据类型(简单值),也有引用数据类型(复杂对象)。

1. 原始数据类型:

这些是 JavaScript 中最基本的数据类型,它们保存单个值。它们是不可变的,这意味着一旦设置了它们的值,就不能更改它们。

a) Number:

表示整数和浮点数。

let x = 42;

b) String:

表示一系列字符。

let name = "Alice";

c) Boolean:

表示真或假。

let isActive = true;

d) Null:

表示故意没有任何对象值。

let person = null;

e) Undefined:

指示已声明但未赋值的变量。

let value;

f) Symbol:

一个唯一的标识符。

const uniqueID = Symbol();

g) BigInt:

用于表示大整数。

let bigNum = 123n;

2. 引用数据类型:

这些数据类型比较复杂,存储值集合或更结构化的数据。它们是可变的,这意味着即使引用保持不变,它们的内容也可以更改。

a) Object:

键值对的集合。

let person = {name: "John"};

b) Array:

值的排序集合。

let arr = [1, 2, 3];

c) Function:

执行任务的代码块。

function greet() {}

JavaScript 变量:

在 JavaScript 中,变量是用于存储数据的命名容器,可以在整个代码中引用和操作这些数据。

变量允许您存储数字、字符串、对象和函数等值。

1. 声明变量:

在 JavaScript 中,变量使用三个关键字之一声明:

var(旧方法,现在较少使用) let(块作用域,在 ES6 中引入) const(块作用域,用于常量,也在 ES6 中引入)

a) var(旧方法):

var 关键字传统上用于在 JavaScript 中声明变量。

var name = "Alice"; var age = 25;

b) let(现代方法):

块作用域意味着变量只能在其定义的块(例如,在 if 语句或循环内)中访问。

let name = "Bob"; let age = 30;

c) const(常量变量):

const 关键字用于声明在初始赋值后不应重新赋值的变量。

const country = "USA";

重新声明变量:

使用 var: 您可以在同一作用域内重新声明变量,JavaScript 不会抛出错误。

var name = "Alice";
var name = "Bob";  // 没有错误
console.log(name);  // 输出:Bob

使用 let 和 const: 您不能在同一作用域内重新声明变量。这样做会导致 SyntaxError。

let name = "Alice";
let name = "Bob";  // SyntaxError: Identifier 'name' has already been declared
const country = "USA";
const country = "Canada";  // SyntaxError: Identifier 'country' has already been declared

JavaScript 运算符:

在 JavaScript 中,运算符是执行操作数操作的符号或关键字。

1. 算术运算符:

这些运算符用于对数值执行数学运算。

<code>+               加法                        5 + 3 → 8
-               减法                        5 - 3 → 2
*               乘法                        5 * 3 → 15
/               除法                        5 / 3 → 1.6667
%               取模(除法的余数)        5 % 3 → 2
**              幂运算(乘方)              2 ** 3 → 8
++              递增(加 1)                let x = 5; x++ → 6
--              递减(减 1)                let x = 5; x-- → 4</code>

2. 赋值运算符:

这些运算符用于将值赋给变量。

<code>=               简单赋值                     let x = 10;
+=              加法赋值                     x += 5; → x = x + 5;
-=              减法赋值                     x -= 5; → x = x - 5;
*=              乘法赋值                     x *= 5; → x = x * 5;
/=              除法赋值                     x /= 5; → x = x / 5;
%=              取模赋值                     x %= 5; → x = x % 5;
**=             幂赋值                       x **= 2; → x = x ** 2;</code>

3. 比较运算符:

这些运算符用于比较两个值并返回布尔值(true 或 false)。

<code>==              等于                          5 == "5" → true
===             全等                          5 === "5" → false
!=              不等于                        5 != "5" → false
!==             不全等                        5 !== "5" → true
>               大于                          5 > 3 → true
>=              大于等于                      5 >= 3 → true
</code>

4. 逻辑运算符:

这些运算符用于执行逻辑运算,通常使用布尔值。

<code>&&              逻辑与                        true && false → false
||              逻辑或                        true || false → true
!               逻辑非                        !true → false</code>

JavaScript 条件语句:

在 JavaScript 中,条件语句用于根据特定条件是否为真或假来执行不同的操作。

1. if 语句

if 语句是最基本的条件语句。如果指定的条件计算结果为真,则执行代码块。

语法:

if (condition) {
    // 如果条件为真,则执行的代码块
}

2. else 语句

else 语句跟在 if 语句之后,定义一个代码块,如果 if 语句中的条件为假,则执行该代码块。

语法:

if (condition) {
    // 如果条件为真,则执行的代码块
} else {
    // 如果条件为假,则执行的代码块
}

3. else if 语句

else if 语句允许您测试多个条件。当您需要检查多个条件时使用它。

语法:

if (condition1) {
    // 如果 condition1 为真,则执行的代码块
} else if (condition2) {
    // 如果 condition2 为真,则执行的代码块
} else {
    // 如果 condition1 和 condition2 都为假,则执行的代码块
}

4. 嵌套 if 语句

您可以将 if 语句嵌套在其他 if 语句中以创建更复杂的条件。

5. switch 语句

switch 语句是测试值与多个条件的一种更有效的方法,尤其是在您有很多不同的可能结果时。

语法:

switch (expression) {
    case value1:
        // 如果 expression === value1,则运行的代码
        break;
    case value2:
        // 如果 expression === value2,则运行的代码
        break;
    default:
        // 如果没有 case 匹配,则运行的代码
}

JavaScript 循环:

在 JavaScript 中,循环用于只要满足特定条件就重复执行代码块。当您想执行重复性任务(例如迭代数组或多次执行代码块)时,这很有用。

1. for 循环

for 循环是 JavaScript 中最常见的循环。当您知道要迭代代码块多少次时,通常使用它。

语法:

for (initialization; condition; increment/decrement) {
    // 每次迭代中要执行的代码
}

2. while 循环

while 循环只要指定的条件计算结果为真就执行代码块。在每次迭代之前检查条件,并且一旦条件变为假,循环就会停止。

语法:

while (condition) {
    // 只要条件为真就执行的代码
}

以上是日期数据类型、变量、运算符、条件语句、Javascript 中的循环的详细内容。更多信息请关注PHP中文网其他相关文章!

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
在JavaScript中替换字符串字符在JavaScript中替换字符串字符Mar 11, 2025 am 12:07 AM

JavaScript字符串替换方法详解及常见问题解答 本文将探讨两种在JavaScript中替换字符串字符的方法:在JavaScript代码内部替换和在网页HTML内部替换。 在JavaScript代码内部替换字符串 最直接的方法是使用replace()方法: str = str.replace("find","replace"); 该方法仅替换第一个匹配项。要替换所有匹配项,需使用正则表达式并添加全局标志g: str = str.replace(/fi

如何创建和发布自己的JavaScript库?如何创建和发布自己的JavaScript库?Mar 18, 2025 pm 03:12 PM

文章讨论了创建,发布和维护JavaScript库,专注于计划,开发,测试,文档和促销策略。

如何在浏览器中优化JavaScript代码以进行性能?如何在浏览器中优化JavaScript代码以进行性能?Mar 18, 2025 pm 03:14 PM

本文讨论了在浏览器中优化JavaScript性能的策略,重点是减少执行时间并最大程度地减少对页面负载速度的影响。

如何使用浏览器开发人员工具有效调试JavaScript代码?如何使用浏览器开发人员工具有效调试JavaScript代码?Mar 18, 2025 pm 03:16 PM

本文讨论了使用浏览器开发人员工具的有效JavaScript调试,专注于设置断点,使用控制台和分析性能。

jQuery矩阵效果jQuery矩阵效果Mar 10, 2025 am 12:52 AM

将矩阵电影特效带入你的网页!这是一个基于著名电影《黑客帝国》的酷炫jQuery插件。该插件模拟了电影中经典的绿色字符特效,只需选择一张图片,插件就会将其转换为充满数字字符的矩阵风格画面。快来试试吧,非常有趣! 工作原理 插件将图片加载到画布上,读取像素和颜色值: data = ctx.getImageData(x, y, settings.grainSize, settings.grainSize).data 插件巧妙地读取图片的矩形区域,并利用jQuery计算每个区域的平均颜色。然后,使用

如何构建简单的jQuery滑块如何构建简单的jQuery滑块Mar 11, 2025 am 12:19 AM

本文将引导您使用jQuery库创建一个简单的图片轮播。我们将使用bxSlider库,它基于jQuery构建,并提供许多配置选项来设置轮播。 如今,图片轮播已成为网站必备功能——一图胜千言! 决定使用图片轮播后,下一个问题是如何创建它。首先,您需要收集高质量、高分辨率的图片。 接下来,您需要使用HTML和一些JavaScript代码来创建图片轮播。网络上有很多库可以帮助您以不同的方式创建轮播。我们将使用开源的bxSlider库。 bxSlider库支持响应式设计,因此使用此库构建的轮播可以适应任何

用JavaScript增强结构标记用JavaScript增强结构标记Mar 10, 2025 am 12:18 AM

核心要点 利用 JavaScript 增强结构化标记可以显着提升网页内容的可访问性和可维护性,同时减小文件大小。 JavaScript 可有效地用于为 HTML 元素动态添加功能,例如使用 cite 属性自动在块引用中插入引用链接。 将 JavaScript 与结构化标记集成,可以创建动态用户界面,例如无需页面刷新的选项卡面板。 确保 JavaScript 增强功能不会妨碍网页的基本功能至关重要;即使禁用 JavaScript,页面也应保持功能正常。 可以使用高级 JavaScript 技术(

如何使用Angular上传和下载CSV文件如何使用Angular上传和下载CSV文件Mar 10, 2025 am 01:01 AM

数据集对于构建API模型和各种业务流程至关重要。这就是为什么导入和导出CSV是经常需要的功能。在本教程中,您将学习如何在Angular中下载和导入CSV文件

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
3 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
3 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
3 周前By尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解锁Myrise中的所有内容
3 周前By尊渡假赌尊渡假赌尊渡假赌

热工具

SublimeText3 英文版

SublimeText3 英文版

推荐:为Win版本,支持代码提示!

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

WebStorm Mac版

WebStorm Mac版

好用的JavaScript开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

SublimeText3 Linux新版

SublimeText3 Linux新版

SublimeText3 Linux最新版