JavaScript基础语法
第一部分 JavaScript基础知识
简介
JavaScript是一种编程语言,用这种编程语言写出来的程序叫做脚本。它们可以被直接写在网页的HTML中,在页面加载时自动执行。脚本被以纯文本的方式提供和执行,不需要特殊的准备或编译即可运行。JavaScript不仅可以在浏览器中执行(浏览器中嵌入了 JavaScript 引擎),也可以在服务端执行,甚至可以在任意搭载了 JavaScript 引擎 的设备中执行。
基础知识
1、变量命名
- 变量命名用
let
,var
是较老的脚本中使用的。 - JavaScript 的变量命名有两个限制:
- 变量名称必须仅包含字母、数字、符号 $ 和 _ 。
- 首字符必须非数字。
- 命名区分大小写,name和NAME是两个不同的变量。
- 声明常量用
const
,常量不能被修改。通常使用大写字母和下划线来命名这些常量。如:const COLOR_RED = "#F00";
- JavaScript被称作“动态类型”的编程语言,即定义一个变量前一刻存储字符串类型数据,下一刻就可以把数字赋值给这个变量。(变量不会在被定义后,限制为某一数据类型)
2、数据类型
- JavaScript中有8种基本数据类型
- Number类型:代表整数和浮点数。特殊数值:
Infinity
、-Infinity
和NaN
也属于Number类型,Infinity
表示∞
,可通过除以0来得到;NaN
由不正确或未定义的数学操作得到。 - BigInt类型:Number类型只能存储±(2 的53次方 -1) 范围内的值,BigInt表示任意长度的整数。
- String类型:
- 在 JavaScript 中,有三种包含字符串的方式:双引号:“Hello”;单引号:‘Hello’;反引号:
Hello
。 - 单引号和双引号几乎无差别,仅表示普通字符串
- 反引号是 功能扩展 引号。它们允许我们通过将变量和表达式包装在
${…}
中,来将它们嵌入到字符串中。如:let name = "John"; // 嵌入一个变量 alert( `Hello, ${name}!` ); // Hello, John! // 嵌入一个表达式 alert( `the result is ${1 + 2}` ); // the result is 3
- 在 JavaScript 中,有三种包含字符串的方式:双引号:“Hello”;单引号:‘Hello’;反引号:
- Boolean类型:true/false
- null值:表示无、空、值未知。
- undefined值:表未被赋值。
- Object 类型:用于存储数据集合和更复杂的实体。
- Symbol 类型:用于创建对象的唯一标志符。
- Number类型:代表整数和浮点数。特殊数值:
- typeof 运算符:返回参数的数据类型。
//书写格式 typeof x 或者 typeof(x)均可 typeof undefined // "undefined" typeof 0 // "number" typeof 10n // "bigint" typeof true // "boolean" typeof "foo" // "string" typeof Symbol("id") // "symbol" typeof Math // "object" typeof null // "object" 这个输出结果是官方承认的typeof的错误 typeof alert // "function"
3、交互:alert、prompt 和 confirm
- prompt函数接收两个参数,浏览器会弹出一个带有输入框的弹窗。
result = prompt(title, [default]); //title显示给用户的文本,[default]可选参数,输入框内的默认值 //result获取用户填入输入框的值,如果取消输入,result用null作为返回值 //举例: let age = prompt('How old are you?', 100); alert(`You are ${age} years old!`); // You are 100 years old!
- confirm函数,弹出一个带有问题的弹框,点击确定返回true,点击取消返回false。
result = confirm(question); //举例: let isBoss = confirm("Are you the boss?"); alert( isBoss ); // 如果“确定”按钮被按下,则显示 true
4、类型转换
有三种常用的类型转换:转换为 string 类型、转换为 number 类型和转换为 boolean 类型。
- 字符串转换 —— 转换发生在输出内容的时候,也可以通过 String(value) 进行显式转换。原始类型值的 string 类型转换通常是很明显的。
- 数字型转换 —— 转换发生在进行算术操作时,也可以通过 Number(value) 进行显式转换。
数字型转换遵循以下规则:值 变成…… undefined NaN null 0 true / false 1/0 string “按原样读取”字符串,两端的空白字符(空格、换行符 \n、制表符 \t 等)会被忽略。空字符串变成 0。转换出错则输出 NaN。 - 布尔型转换 —— 转换发生在进行逻辑操作时,也可以通过 Boolean(value) 进行显式转换。
布尔型转换遵循以下规则:值 变成…… 0, null, undefined, NaN, “” false 其他值 true
【注】: 对 “0” 和只有空格的字符串(比如:" ")进行布尔型转换时,输出结果为 true。
5、三元运算符和空值合并运算符
- 三元运算符
a?b:c
,a部分为true的话执行b部分,否则执行c部分。 - 空值合并运算符(新增的特性),当一个值A既不是null,也不是undefined,我们称为已定义。
A??B
的结果是,若A已定义,结果为A,若A未定义,结果为B//示例: let user; alert(user ?? "匿名"); // 匿名(user 未定义) let user = "John"; alert(user ?? "匿名"); // John(user 已定义)
- 空值合并运算符区别于逻辑运算符中的或
let firstName = null; let lastName = null; let nickName = "Supercoder"; // 显示第一个已定义的值: alert(firstName ?? lastName ?? nickName ?? "匿名"); // Supercoder // 显示第一个真值: alert(firstName || lastName || nickName || "Anonymous"); // Supercoder // || 无法区分 false、0、空字符串 "" 和 null/undefined。它们都是假值 // 如果我们只想在变量的值为 null/undefined 时使用默认值,就需要用??
6、一次跳出多层嵌套循环
break <labelName>
语句跳出循环至标签处:
outer: for (let i = 0; i < 3; i++) {
for (let j = 0; j < 3; j++) {
let input = prompt(`Value at coords (${i},${j})`, '');
// 如果是空字符串或被取消,则中断并跳出这两个循环。
if (!input) break outer; // (*)
// 用得到的值做些事……
}
}
alert('Done!');
//break outer 向上寻找名为 outer 的标签并跳出当前循环。
continue 指令也可以与标签一起使用。在这种情况下,执行跳转到标记循环的下一次迭代。