05 JavaScript学习：语法

news2024/11/16 13:38:49

JavaScript 是一种动态类型的脚本语言，广泛用于网页开发和构建交互式网页。JavaScript 的语法相对简单，但功能强大，它可以在客户端执行，并与HTML和CSS一起构建交互式的网页。
在这里插入图片描述

JavaScript 字面量

在 JavaScript 中，字面量是表示固定值的表达式。字面量可以是字符串、数字、布尔值、对象、数组等。以下是一些常见的 JavaScript 字面量及其示例：

  1. 字符串字面量：用单引号或双引号括起来的文本值。
let str1 = 'Hello, World'; // 字符串字面量
let str2 = "JavaScript"; // 字符串字面量
  1. 数字字面量：表示数值的字面量。
let num1 = 42; // 整数字面量
let num2 = 3.14; // 浮点数字面量
  1. 布尔值字面量：表示逻辑值的字面量，只能是 true 或 false。
let isTrue = true; // 布尔值字面量
let isFalse = false; // 布尔值字面量
  1. 对象字面量：表示对象的字面量，包含一组键值对。
let person = { 
    name: 'Alice', 
    age: 30 
}; // 对象字面量
  1. 数组字面量：表示数组的字面量，包含一组值。
let numbers = [1, 2, 3, 4]; // 数组字面量
  1. 正则表达式字面量：表示正则表达式的字面量，用于匹配文本模式。
let pattern = /JavaScript/; // 正则表达式字面量
  1. 函数字面量：表示函数的字面量，可以直接定义匿名函数。
let greet = function(name) {
    return 'Hello, ' + name + '!';
}; // 函数字面量
  1. 模板字面量：使用反引号 ` 表示的字符串字面量，支持多行字符串和字符串插值。
let message = `Hello,
World!`; // 模板字面量

以上是一些常见的 JavaScript 字面量及其示例。字面量在 JavaScript 中非常常见，它们提供了一种直接表示固定值的方式，使代码更易读和编写。

JavaScript 变量定义

在 JavaScript 中，变量定义是指声明一个变量并为其分配一个值。JavaScript 中有三种方式来定义变量：var、let 和 const。以下是它们的用法和区别：

  1. var：
    var 是 JavaScript 最早引入的声明变量的关键字。使用 var 声明的变量具有函数作用域，而不是块级作用域。
var x = 10; // 使用 var 定义变量 x
  1. let：
    let 是 ES6（ECMAScript 2015）引入的声明变量的关键字。使用 let 声明的变量具有块级作用域，只在声明的块内部有效。
let y = 20; // 使用 let 定义变量 y
  1. const：
    const 也是 ES6 引入的声明变量的关键字，用于声明常量，常量的值不能被重新赋值。
const PI = 3.14; // 使用 const 定义常量 PI

在 JavaScript 中，变量定义时可以不指定初始值，此时变量的值为 undefined。

let z; // 定义变量 z，值为 undefined

另外，JavaScript 是一种动态类型语言，变量的类型是在运行时确定的，因此可以随时改变变量的值和类型。

let name = 'Alice'; // 字符串类型
name = 30; // 数字类型

总结一下：

  • 使用 var 定义的变量具有函数作用域。
  • 使用 let 定义的变量具有块级作用域。
  • 使用 const 定义的变量为常量，值不可改变。

在实际开发中，推荐使用 let 和 const 来定义变量，因为它们更安全、可预测，并且更符合现代 JavaScript 的最佳实践。

JavaScript 操作符

在 JavaScript 中，操作符用于执行各种操作，比如算术运算、赋值、比较、逻辑运算等。以下是一些常见的 JavaScript 操作符：

  1. 算术运算符：
  • +：加法
  • -：减法
  • *：乘法
  • /：除法
  • %：取余
let sum = 2 + 3; // 5
let difference = 5 - 2; // 3
let product = 3 * 4; // 12
let quotient = 10 / 2; // 5
let remainder = 10 % 3; // 1
  1. 赋值运算符：
  • =：赋值
  • +=：加后赋值
  • -=：减后赋值
  • *=：乘后赋值
  • /=：除后赋值
let x = 5;
x += 3; // 相当于 x = x + 3，结果为 8
  1. 比较运算符：
  • ==：相等
  • ===：严格相等（值和类型都相等）
  • !=：不相等
  • !==：严格不相等
  • >：大于
  • <：小于
  • >=：大于等于
  • <=：小于等于
let a = 5;
let b = '5';
console.log(a == b); // true
console.log(a === b); // false
  1. 逻辑运算符：
  • &&：逻辑与
  • ||：逻辑或
  • !：逻辑非
let x = 10;
let y = 5;
console.log(x > 5 && y < 10); // true
console.log(x > 10 || y > 5); // false
  1. 三元运算符：
  • condition ? expr1 : expr2：如果条件为真，则返回表达式1，否则返回表达式2。
let age = 18;
let message = age >= 18 ? '成年人' : '未成年人';
console.log(message); // 成年人
  1. 递增和递减运算符：
  • ++：递增
  • --：递减
let count = 5;
count++; // count 现在为 6

这些是 JavaScript 中一些常见的操作符，它们可以帮助您执行各种操作和计算。熟练掌握这些操作符可以提高编程效率和代码的清晰度。

JavaScript 语句格式

在 JavaScript 中，语句是一组指令，用于执行特定的操作。每条语句通常以分号 ; 结尾，但在某些情况下分号可以省略。以下是 JavaScript 语句的一般格式和一些常见类型的语句：

一般格式：

// 单条语句
statement;

// 多条语句
statement1;
statement2;
statement3;

常见类型的语句：

  1. 赋值语句：将一个值赋给一个变量。
let x = 10;
  1. 条件语句：根据条件执行不同的代码块。
if (condition) {
    // code block
} else {
    // code block
}
  1. 循环语句：重复执行一段代码块。
for (let i = 0; i < 5; i++) {
    // code block
}

while (condition) {
    // code block
}
  1. 函数调用语句：调用函数执行特定的操作。
function greet(name) {
    return 'Hello, ' + name + '!';
}

let message = greet('Alice');
  1. 返回语句：从函数中返回一个值。
function add(a, b) {
    return a + b;
}
  1. 声明语句：声明变量或函数。
let x;
function greet(name) {
    return 'Hello, ' + name + '!';
}
  1. 控制语句：控制代码的执行流程。
break; // 跳出循环
continue; // 跳过当前循环
  1. 注释语句：用于添加注释，不会被执行。
// 单行注释

/*
多行
注释
*/

在 JavaScript 中，语句的排列顺序和语法的正确性对代码的执行结果至关重要。正确使用语句可以使代码更具可读性、可维护性和可扩展性。

JavaScript 关键字

在这里插入图片描述

在 JavaScript 中，关键字是一些被语言保留用于特定目的的单词，不能被用作变量名或函数名。以下是 JavaScript 中一些常见的关键字：

  1. 保留关键字：
  • break：终止循环或 switch 语句的执行。
  • case：在 switch 语句中指定不同的情况。
  • catch：捕获 try 语句中的异常。
  • continue：跳出当前循环的迭代并继续下一次迭代。
  • default：在 switch 语句中指定默认情况。
  • do：执行一个语句块，并在条件为真时重复执行该块。
  • else：在 if 语句中指定条件为假时执行的代码块。
  • finally：在 try 语句块结束后执行的代码块。
  • for：创建一个循环，包含初始化、条件和递增部分。
  • function：定义一个函数。
  • if：指定一个条件并执行相应的代码块。
  • return：从函数中返回一个值。
  • switch：根据不同的情况执行不同的代码块。
  • throw：抛出一个异常。
  • try：定义一个包含可能出现异常的代码块。
  • var：声明一个变量。
  • let：声明一个块级作用域的变量。
  • const：声明一个常量。
  • while：创建一个循环，只要指定的条件为真就重复执行代码块。
  1. 保留字：
  • class：定义一个类。
  • enum：定义一个枚举类型。
  • export：导出一个模块。
  • extends：扩展一个类。
  • import：导入一个模块。
  • super：调用父类的构造函数。
  • implements：实现一个接口。
  • interface：定义一个接口。
  • package：定义一个包。
  • private：声明私有成员。
  • protected：声明受保护的成员。
  • public：声明公共成员。
  • static：声明静态成员。

以上是一些常见的 JavaScript 关键字和保留字。在编写 JavaScript 代码时，应避免将这些关键字用作变量名或函数名，以免产生意外的错误。

JavaScript 注释

在 JavaScript 中，注释用于向代码中添加说明性文字，这些文字不会被执行，可以帮助其他开发人员理解代码的意图。JavaScript 支持单行注释和多行注释两种形式。

单行注释：

单行注释以 // 开头，直到行末为止，用于注释单行代码或语句。

// 这是单行注释
let x = 10; // 定义变量 x 并赋值为 10

多行注释：

多行注释以 /* 开头，以 */ 结尾，可以跨越多行，用于注释多行代码块或文本。

/*
这是
多行
注释
*/
let y = 20; // 定义变量 y 并赋值为 20

注释的作用：

  1. 解释代码：注释可以帮助其他开发人员理解代码的逻辑和用途。
  2. 调试代码：可以通过注释暂时禁用一段代码，以帮助调试。
  3. 标记代码：可以使用注释标记待办事项或需要进一步处理的部分。
  4. 文档化代码：注释可以作为代码文档的一部分，帮助生成文档。

最佳实践：

  • 注释应该清晰、简洁，并与代码风格保持一致。
  • 避免注释过多或无关紧要的注释，应该注释那些复杂或不易理解的部分。
  • 定期检查和更新注释，确保注释与代码的实际情况保持一致。

在编写 JavaScript 代码时，良好的注释习惯可以提高代码的可读性和可维护性，有助于团队协作和代码的长期维护。

JavaScript 数据类型的概念

在 JavaScript 中，数据类型用于定义变量或表达式可以存储的数据的类型。JavaScript 是一种动态类型语言，这意味着变量的数据类型是在运行时自动确定的，而不是在编写代码时显式指定。JavaScript 中的数据类型可以分为以下几类：

  1. 基本数据类型：

    • 字符串（String）：表示文本数据，用单引号或双引号括起来。
    • 数字（Number）：表示数值，包括整数和浮点数。
    • 布尔值（Boolean）：表示逻辑值，只有两个取值：true 和 false。
    • 空值（Null）：表示一个空值或不存在的值。
    • 未定义（Undefined）：表示一个未定义的值。
    • 符号（Symbol）：ES6 新增，表示唯一的、不可改变的值。

  2. 复杂数据类型：

    • 对象（Object）：表示复杂数据结构，可以包含多个键值对。
    • 数组（Array）：表示一组有序的值，通过索引访问。
    • 函数（Function）：表示可执行的代码块，可以接受参数并返回值。
    • 日期（Date）：表示日期和时间。
    • 正则表达式（RegExp）：表示用于匹配字符串的模式。

  3. 特殊数据类型：

    • NaN：表示一个非数字值。
    • Infinity：表示正无穷大。
    • -Infinity：表示负无穷大。

JavaScript 的数据类型具有动态性，变量可以随时改变其数据类型。例如，一个变量可以先存储数字，然后存储字符串。这种灵活性使得 JavaScript 在处理不同类型的数据时非常方便。

了解 JavaScript 的数据类型是编写有效和健壮代码的基础，因为不同的数据类型在操作和处理时会有不同的行为。

JavaScript 函数定义

在 JavaScript 中，函数是一段可重复使用的代码块，用于执行特定的任务或计算，并可以接受参数和返回值。函数定义的基本语法如下：

function functionName(parameter1, parameter2, ...) {
    // 函数体，包含要执行的代码
    return result; // 可选，返回值
}
  • function：关键字用于声明函数。
  • functionName：函数的名称，用于调用函数。
  • parameter1, parameter2, ...：函数的参数列表，可以传入函数内部使用的值。
  • {}：包裹函数体的花括号，内部包含要执行的代码。
  • return：可选的关键字，用于返回函数的结果。

下面是一个简单的函数定义的示例：

function greet(name) {
    return 'Hello, ' + name + '!';
}

在上面的示例中，greet 是函数的名称，name 是函数的参数。函数体内的代码拼接了一个问候语，并通过 return 语句返回结果。

匿名函数：

除了具名函数，JavaScript 还支持匿名函数，即没有名称的函数。匿名函数通常用作回调函数或立即执行函数。

let greet = function(name) {
    return 'Hello, ' + name + '!';
};

箭头函数：

ES6 引入了箭头函数的语法，简化了函数的定义方式。

let greet = (name) => {
    return 'Hello, ' + name + '!';
};

函数调用：

定义函数后，可以通过函数名和参数列表来调用函数并获取返回值。

let message = greet('Alice');
console.log(message); // 输出：Hello, Alice!

函数是 JavaScript 中非常重要的概念，它们可以帮助组织和重用代码，提高代码的可读性和可维护性。

JavaScript 大小写敏感

是的，JavaScript 是一种大小写敏感的编程语言，这意味着在 JavaScript 中，标识符（如变量名、函数名、关键字等）是区分大小写的。这意味着以下情况是不同的：

  • 变量名 myVariable 和 myvariable 是不同的。
  • 函数名 myFunction 和 myfunction 是不同的。
  • 关键字 if 和 IF 是不同的。

在 JavaScript 中，大小写敏感性可以带来一些问题，特别是在命名变量、函数和对象属性时。因此，在编写 JavaScript 代码时，建议遵循一致的命名约定，以避免混淆和错误。

下面是一些关于大小写敏感性的示例：

let myVariable = 10;
let MyVariable = 20;

console.log(myVariable); // 输出：10
console.log(MyVariable); // 输出：20

function myFunction() {
    return 'Hello';
}

function MyFunction() {
    return 'World';
}

console.log(myFunction()); // 输出：Hello
console.log(MyFunction()); // 输出：World

在上面的示例中，myVariable 和 MyVariable、myFunction 和 MyFunction 是不同的标识符，因为 JavaScript 区分大小写。

因此，在编写 JavaScript 代码时，请务必注意大小写敏感性，以确保代码的正确性和可读性。

JavaScript 字符集

JavaScript 使用 Unicode 字符集。

Unicode 覆盖了所有的字符，包含标点等字符。

关注我，不迷路，共学习，同进步

关注我，不迷路，共学习，同进步

在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

CUDA编程---线程束洗牌指令

CUDA编程---线程束洗牌指令

从Kepler系列的GPU&#xff08;计算能力为3.0或更高&#xff09;开始&#xff0c;洗牌指令&#xff08;shuffle instruction&#xff09;作为一种机制被加入其中&#xff0c;只要两个线程在相同的线程束中&#xff0c;那么就允许这两个线程直接读取另一个线程的寄存器。 洗牌指…
阅读更多...
实验 3--表的基本操作与数据查询

实验 3--表的基本操作与数据查询

文章目录 实验 3--表的基本操作与数据查询4.3.1 实验目的4.3.2 实验准备实验内容1.在 SSMS 中向数据库 YGKQ 中的表插入数据。2.使用 T-SQL 语句向 YGKQ 中的表插入数据。3.在 SSMS 中删除数据库 YGKQ 中的表数据。4.使用 T-SQL 语句删除数据库 YGKQ中的表数据。5.在 SSMS 中修…
阅读更多...
高级IO和5种IO模型

高级IO和5种IO模型

目录 1. 高级IO1.1 IO的基本概念1.2 OS如何得知外设当中有数据可读取1.3 OS如何处理从网卡中读取到的数据包1.4 IO的步骤 2. 五种IO模型2.1 利用钓鱼来理解2.2 阻塞IO2.3 非阻塞IO2.4 信号驱动IO2.5 IO多路转接2.6 异步IO 3. 高级IO的概念3.1 同步通信 VS 异步通信3.2 阻塞 VS …
阅读更多...
《C语言深度解剖》(9)：深度剖析数据在内存中的存储

《C语言深度解剖》(9)：深度剖析数据在内存中的存储

&#x1f921;博客主页&#xff1a;醉竺 &#x1f970;本文专栏&#xff1a;《C语言深度解剖》 &#x1f63b;欢迎关注&#xff1a;感谢大家的点赞评论关注&#xff0c;祝您学有所成&#xff01; ✨✨&#x1f49c;&#x1f49b;想要学习更多数据结构与算法点击专栏链接查看&am…
阅读更多...
ubuntu22.04 CH340/CH34x 驱动安装

ubuntu22.04 CH340/CH34x 驱动安装

CH34x驱动地址&#xff1a;CH341SER_LINUX.ZIP - 南京沁恒微电子股份有限公司 1、卸载旧驱动&#xff08;如果存在&#xff09; sudo rmmod ch341.ko 2、解压进入 driver 目录 unzip CH341SER_LINUX.ZIP cd CH341SER_LINUX/driver 3、编译 make 可能错误&#xff1a; make[1]…
阅读更多...
Linux的学习之路：18、进程间通信（2）

Linux的学习之路：18、进程间通信（2）

摘要 本章主要是说一下命名管道和共享内存 目录 摘要 一、命名管道 1、创建一个命名管道 2、匿名管道与命名管道的区别 3、命名管道的打开规则 4、代码实现 二、system V共享内存 1、共享内存 2、共享内存函数 三、代码 四、思维导图 一、命名管道 1、创建一个命…
阅读更多...
企业车辆管理系统平台是做什么的？

企业车辆管理系统平台是做什么的？

企业车辆管理系统平台是一种综合性的管理系统&#xff0c;它主要集车辆信息管理、车辆调度、车辆维修、油耗管理、驾驶员管理以及报表分析等多种功能于一体。通过这个平台&#xff0c;企业可以实现对车辆的全面管理&#xff0c;优化车辆使用效率&#xff0c;降低运营成本&#…
阅读更多...
SpringAOP从入门到源码分析大全（四）SpringAOP的源码分析

SpringAOP从入门到源码分析大全（四）SpringAOP的源码分析

文章目录 系列文档索引六、EnableAspectJAutoProxy源码分析1、AnnotationAwareAspectJAutoProxyCreator源码&#xff08;1&#xff09;wrapIfNecessary方法&#xff08;2&#xff09;createProxy 2、getAdvicesAndAdvisorsForBean查找所有Advisor&#xff08;1&#xff09;find…
阅读更多...
进程概述与进程创建

进程概述与进程创建

进程概述 程序和进程是计算机科学中的基本概念&#xff0c;它们经常被提到&#xff0c;尤其是在操作系统的上下文中。这两个概念虽然紧密相关&#xff0c;但有明显的区别&#xff1a; 程序&#xff08;Program&#xff09; 程序是指存储在磁盘上的一组指令和数据&#xff0c…
阅读更多...
【Vue3】$subscribe订阅与反应

【Vue3】$subscribe订阅与反应

&#x1f497;&#x1f497;&#x1f497;欢迎来到我的博客&#xff0c;你将找到有关如何使用技术解决问题的文章&#xff0c;也会找到某个技术的学习路线。无论你是何种职业&#xff0c;我都希望我的博客对你有所帮助。最后不要忘记订阅我的博客以获取最新文章&#xff0c;也欢…
阅读更多...
STM32标准库编程与51单片机直接写寄存器的区别和联系

STM32标准库编程与51单片机直接写寄存器的区别和联系

简介&#xff1a; 在学完51单片机之后&#xff0c;我们去学习32的时候&#xff0c;会发现编程的方法有很大的区别&#xff0c;让人非常的不适应&#xff0c;但是通过不断的调用相应外设的库函数之后&#xff0c;你也可以去编程STM32&#xff0c;来实现功能&#xff0c;但是你真…
阅读更多...
nodejs版本过高导致vue-cli无法启动的解决方案

nodejs版本过高导致vue-cli无法启动的解决方案

目录 前言异常现象解决方案总结 前言 之前使用软件管家升级了Nodejs&#xff0c;今天在运行Vue项目的时候老是报错&#xff0c;查了很多资料&#xff0c;最后确定是Nodejs版本过高导致的。 异常现象 E:\project\ry\RuoYi-Cloud\ruoyi-ui>npm run dev> ruoyi3.6.4 dev …
阅读更多...
Attention和Transformer灵魂七问

Attention和Transformer灵魂七问

1. 引言 最近&#xff0c;ChatGPT和其他聊天机器人将大语言模型LLMs推到了风口浪尖。这就导致了很多不是学ML和NLP领域的人关注并学习attention和Transformer模型。在本文中&#xff0c;我们将针对Transformer模型结构提出几个问题&#xff0c;并深入探讨其背后的技术理论。这…
阅读更多...
实验2 组合逻辑电路与时序逻辑电路设计

实验2 组合逻辑电路与时序逻辑电路设计

实验目的： 1.构建基于verilog语言的组合逻辑电路和时序逻辑电路； 2.掌握verilog语言的电路设计技巧。 3.完成如下功能：加法器、译码器、多路选择器、计数器、移位寄存器等。 实验内容及步骤： 一、实验原理 原理图文件《数字系统设计_sch.pdf》，找到如下两个部分： 图…
阅读更多...
Vim编辑器的安装及使用教程

Vim编辑器的安装及使用教程

文章目录 1&#xff1a;Ubuntu安装Vim1.1&#xff1a;图形界面安装1.2&#xff1a;命令行安装vim1.3&#xff1a;判断vim是否安装成功 2&#xff1a;vim简介3&#xff1a;vim的三种模式4&#xff1a;vim常用按键说明4.1 命令模式4.2 搜索和替换4.3 复制、粘贴和删除4.4 一般模式…
阅读更多...
网络工程师---第十天

网络工程师---第十天

ARP表&#xff1a; 提起ARP表必然先想起ARP&#xff08;address resolution protocol&#xff09;协议&#xff0c;地址解析协议。 在实际应用中&#xff0c;我们经常遇到这样的问题&#xff1a;已知一个机器的IP地址&#xff0c;但在实际网络的链路上传送数据帧时&#xff0c;…
阅读更多...
20240331-1-基于深度学习的模型

20240331-1-基于深度学习的模型

基于深度学习的模型 知识体系 主要包括深度学习相关的特征抽取模型&#xff0c;包括卷积网络、循环网络、注意力机制、预训练模型等。 CNN TextCNN 是 CNN 的 NLP 版本&#xff0c;来自 Kim 的 [1408.5882] Convolutional Neural Networks for Sentence Classification 结…
阅读更多...
[ICCV2023]DIR-用于从单个RGB图像重建交互手部的解耦迭代细化框架

[ICCV2023]DIR-用于从单个RGB图像重建交互手部的解耦迭代细化框架

这篇论文的标题是《Decoupled Iterative Refinement Framework for Interacting Hands Reconstruction from a Single RGB Image》&#xff0c;作者是Pengfei Ren, Chao Wen, Xiaozheng Zheng, Zhou Xue, Haifeng Sun, Qi Qi, Jingyu Wang, Jianxin Liao。他们来自北京邮电大学…
阅读更多...
Nodejs安装与配置--基于Linux系统--RedHat7.9

Nodejs安装与配置--基于Linux系统--RedHat7.9

nodejs安装从未这么简单 1、nodejs版本设置&#xff1f; curl -fsSL https://rpm.nodesource.com/setup_16.x | sudo bash - 其他版本如下&#xff1a; * https://rpm.nodesource.com/setup_16.x — Node.js 16 "Gallium" (deprecated) * https://rpm.nodesource.co…
阅读更多...
vue-project-tree vue3 树形结构展示组件

vue-project-tree vue3 树形结构展示组件

GitHub&#xff1a;vue-project-tree by one-ccs Gitee&#xff1a;vue-project-tree by one-ccs 遵循 MIT 开源协议 文章目录 vue-project-tree一、使用二、API1、属性2、事件3、方法4、插槽 vue-project-tree 使用 Vue3 TS 实现的树形结构展示组件&#xff0c;有拖拽、排序…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023