【基础篇】JavaScript基础语法速览

简介: 【基础篇】JavaScript基础语法速览

 image.gif编辑

文章目录

前言

一、JavaScript 字面量

二、JavaScript 变量

三、JavaScript 操作符

四、JavaScript 语句

五、JavaScript 关键字

六、JavaScript 注释

七、JavaScript 数据类型

八、数据类型的概念

九、JavaScript 函数

十、JavaScript 字母大小写

十一、JavaScript 字符集

总结


前言

     每一门开发语言都有自己的语法规则,JavaScript 是一个脚本语言。它是一个轻量级,但功能强大的编程语言。它也有自己的一条语法体系,那么今天的文章就带你一起系统的学习一下JavaScript的语法。


一、JavaScript 字面量

在编程语言中,一般固定值称为字面量,如 3.14。

数字(Number)字面量 可以是整数或者是小数,或者是科学计数(e)。

3.14
1001
123e5

image.gif

字符串(String)字面量 可以使用单引号或双引号:

"John Doe"
'John Doe'

image.gif

表达式字面量 用于计算:

5 + 6
5 * 10

image.gif

数组(Array)字面量 定义一个数组:

[40, 100, 1, 5, 25, 10]

image.gif

对象(Object)字面量 定义一个对象:

{firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"}

image.gif

函数(Function)字面量 定义一个函数:

function myFunction(a, b) { return a * b;}

image.gif


二、JavaScript 变量

在编程语言中,变量用于存储数据值。

JavaScript 使用关键字 var 来定义变量, 使用等号来为变量赋值:

var x, length
x = 5
length = 6

image.gif

变量可以通过变量名访问。在指令式语言中,变量通常是可变的。字面量是一个恒定的值。


编辑
变量是一个名称。字面量是一个

三、JavaScript 操作符

JavaScript使用 算术运算符 来计算值:

(5 + 6) * 10

image.gif

JavaScript使用赋值运算符给变量赋值:

x = 5
y = 6
z = (x + y) * 10

image.gif

JavaScript语言有多种类型的运算符:

类型 实例 描述
赋值,算术和位运算符 =  +  -  *  / 在 JS 运算符中描述
条件,比较及逻辑运算符 ==  != <  >  在 JS 比较运算符中描述

四、JavaScript 语句

在 HTML 中,JavaScript 语句向浏览器发出的命令。

语句是用分号分隔:

x = 5 + 6;
y = x * 10;

image.gif


五、JavaScript 关键字

JavaScript 关键字用于标识要执行的操作。

和其他任何编程语言一样,JavaScript 保留了一些关键字为自己所用。

var 关键字告诉浏览器创建一个新的变量:

var x = 5 + 6;
var y = x * 10;

image.gif

JavaScript 同样保留了一些关键字,这些关键字在当前的语言版本中并没有使用,但在以后 JavaScript 扩展中会用到。

以下是 JavaScript 中最重要的保留关键字(按字母顺序):

abstract else instanceof super
boolean enum int switch
break export interface synchronized
byte extends let this
case false long throw
catch final native throws
char finally new transient
class float null true
const for package try
continue function private typeof
debugger goto protected var
default if public void
delete implements return volatile
do import short while
double in static with

六、JavaScript 注释

不是所有的 JavaScript 语句都是"命令"。双斜杠 // 后的内容将会被浏览器忽略:

// 我不会执行

image.gif


七、JavaScript 数据类型

JavaScript 有多种数据类型:数字,字符串,数组,对象等等:

var length = 16;                                  // Number 通过数字字面量赋值
var points = x * 10;                              // Number 通过表达式字面量赋值
var lastName = "Johnson";                         // String 通过字符串字面量赋值
var cars = ["Saab", "Volvo", "BMW"];              // Array  通过数组字面量赋值
var person = {firstName:"John", lastName:"Doe"};  // Object 通过对象字面量赋值

image.gif


八、数据类型的概念

编程语言中,数据类型是一个非常重要的内容。

为了可以操作变量,了解数据类型的概念非常重要。

如果没有使用数据类型,以下实例将无法执行:

16 + "Volvo"

image.gif

16 加上 "Volvo" 是如何计算呢? 以上会产生一个错误还是输出以下结果呢?

"16Volvo"

image.gif

你可以在浏览器尝试执行以上代码查看效果。

在接下来的章节中你将学到更多关于数据类型的知识。


九、JavaScript 函数

JavaScript 语句可以写在函数内,函数可以重复引用:

引用一个函数 = 调用函数(执行函数内的语句)。

function myFunction(a, b) {
    return a * b;                                // 返回 a 乘以 b 的结果
}

image.gif


十、JavaScript 字母大小写

JavaScript 对大小写是敏感的。

当编写 JavaScript 语句时,请留意是否关闭大小写切换键。

函数 getElementByIdgetElementbyID 是不同的。

同样,变量 myVariableMyVariable 也是不同的。


十一、JavaScript 字符集

JavaScript 使用 Unicode 字符集。

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


总结

       以上就是今天要讲的内容,本文系统的带你您回顾了一下JavaScript的语法 ,不知道你掌握了多少,您的点赞关注支持是作者前进的最大动力,咱们下期文章见~~

image.gif编辑


目录
相关文章
|
4月前
|
存储 JavaScript 前端开发
Node.js的基本语法
【8月更文挑战第12天】Node.js的基本语法
153 1
|
2月前
|
JavaScript 前端开发
JavaScript 函数语法
JavaScript 函数是使用 `function` 关键词定义的代码块,可在调用时执行特定任务。函数可以无参或带参,参数用于传递值并在函数内部使用。函数调用可在事件触发时进行,如用户点击按钮。JavaScript 对大小写敏感,函数名和关键词必须严格匹配。示例中展示了如何通过不同参数调用函数以生成不同的输出。
|
2月前
|
JavaScript 前端开发 大数据
在JavaScript中,Object.assign()方法或展开语法(...)来合并对象,Object.freeze()方法来冻结对象,防止对象被修改
在JavaScript中,Object.assign()方法或展开语法(...)来合并对象,Object.freeze()方法来冻结对象,防止对象被修改
35 0
|
4月前
|
JavaScript 前端开发
JavaScript基础&实战(1)js的基本语法、标识符、数据类型
这篇文章是JavaScript基础与实战教程的第一部分,涵盖了JavaScript的基本语法、标识符、数据类型以及如何进行强制类型转换,通过代码示例介绍了JS的输出语句、编写位置和数据类型转换方法。
JavaScript基础&实战(1)js的基本语法、标识符、数据类型
|
4月前
|
前端开发 JavaScript 程序员
前端 JavaScript 的 _ 语法是个什么鬼?
前端 JavaScript 的 _ 语法是个什么鬼?
|
5月前
|
缓存 JavaScript 前端开发
前端框架与库 - Vue.js基础:模板语法、数据绑定
【7月更文挑战第14天】Vue.js 是渐进式框架,以简洁API和高效数据绑定知名。本文聚焦模板语法与数据绑定,解释常见问题和易错点,助力初学者避坑。模板语法中,{{ expression }} 用于渲染值,v-bind/: 用于动态绑定属性。数据绑定涉及文本、属性和事件,注意v-model适用于表单元素,计算属性有缓存。理解正确用法,借助文档和IDE,可提升开发质量和效率。善用Vue.js,打造响应式UI。
167 4
|
6月前
|
存储 JavaScript 前端开发
JavaScript 语法
JavaScript 语法
40 5
|
5月前
|
存储 JavaScript 前端开发
|
6月前
|
JavaScript 前端开发
JavaScript语法关键点:变量用`var`、`let`、`const`声明
【6月更文挑战第22天】JavaScript语法关键点:变量用`var`、`let`、`const`声明;七种数据类型包括`Number`、`String`、`Boolean`、`Null`、`Undefined`、`Symbol`和`Object`;运算符如算术、比较、逻辑和赋值;流程控制有`if...else`、`switch`和各种循环。了解这些是JS编程的基础。
63 3
|
5月前
|
前端开发 JavaScript
js【详解】Promise(含 Promise 的三种状态及其变化,创建 Promise, Promise.all 语法、Promise.all 实战范例、手写 Promise.all)
js【详解】Promise(含 Promise 的三种状态及其变化,创建 Promise, Promise.all 语法、Promise.all 实战范例、手写 Promise.all)
716 0