【Javascript】第一部分-Aet

Bingliaolong 2021-05-10 13:12 Aet | 隐藏边栏 | 抢沙发 | 13 0

文章评分 8 次，平均分 5.0 ：

"上层"语言

允许开发者使用另一种语言编写代码并会将其“自动转换”为 JavaScript。
CoffeeScript
1. JavaScript 的一种语法糖。它引入了更加简短的语法，使我们可以编写更清晰简洁的代码。
TypeScript
1. 专注于添加“严格的数据类型”以简化开发，以更好地支持复杂系统的开发。
Flow
1. 也添加了数据类型，但是以一种不同的方式。
Dart
1. 是一门独立的语言。它拥有自己的引擎，该引擎可以在非浏览器环境中运行（例如手机应用），它也可以被编译成 JavaScript。

script标签

JavaScript 程序可以在 <script> 标签的帮助下插入到 HTML 文档的任何地方。
<script\>标签中包裹了 JavaScript 代码，当浏览器遇到 <script\> 标签，代码会自动运行。

<!DOCTYPE HTML>

<html>

<body>

<p>script 标签之前...</p>

alert('Hello, world!');

</script>

<p>...script 标签之后</p>

</body>

</html>

外部脚本

如果你有大量的 JavaScript 代码，我们可以将它放入一个单独的文件。
脚本文件可以通过 src 特性（attribute）添加到 HTML 文件中。

1	<script src="/path/to/script.js"></script>

URL

1	<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js"></script>

多个脚本

…

注意

如果设置了 src 特性，script 标签内容将会被忽略。

基础知识一

分号

即使语句被换行符分隔了，我们依然建议在它们之间加分号。

注释

需要注意的是不支持注释嵌套

// 这行注释独占一行

alert('Hello');

alert('World'); // 这行注释跟随在语句后面

/* 两个消息的例子。

这是一个多行注释。

alert('Hello');

alert('World');

use strict

当它处于脚本文件的顶部时，则整个脚本文件都将以“现代”模式进行工作。
要确保 "use strict" 出现在脚本的最顶部，否则严格模式可能无法启用。
一旦进入了严格模式，没有返回默认模式的方法。

"use strict";

// 代码以现代模式工作

...

变量

在 JavaScript 中创建一个变量，我们需要用到 let 关键字。
var 关键字与 let 大体相同，也用来声明变量，但稍微有些不同，也有点“老派”。
作用域方面的区别：
1. var声明的变量在其声明的函数内是局部的，而在函数外部是全局的
2. var在函数外部声明的变量，将成为全局变量，并且被添加到全局对象
3. let声明的变量是块级作用域，只在包含他们的块内部{}可用
变量提升方面的区别：
1. var声明的变量存在变量提升现象，意味着变量可以在其声明之前被访问，但是其值是undefined。因为变量声明会被提升到其作用域的顶部
2. let声明的变量同样存在变量提升，但是在声明前访问会报ReferenceError错误，因为变量在生灵之前不会被初始化

1 2	console.log(x); // 输出 undefined var x = 10;

重复声明方面的区别：
1. var声明的变量可以被多次声明而不会引发错误，新的声明会覆盖旧的声明
2. let声明的变量不能在同一作用域内被重复声明

let message;

message = 'Hello!';

alert(message); // 显示变量内容

// 使用 var 声明变量

var x = 10;

console.log(x); // 输出 10

{

var x = 20;

console.log(x); // 输出 20

}

console.log(x); // 输出 20

// 使用 let 声明变量

let y = 10;

console.log(y); // 输出 10

{

let y = 20;

console.log(y); // 输出 20

}

console.log(y); // 输出 10

关于变量提升：
1. 变量提升的行为在于 JavaScript 引擎在执行代码之前会扫描代码，将变量和函数声明提升到作用域的顶部
2. 具体来说，当 JavaScript 引擎在执行代码之前扫描代码时，它会查找并记住所有变量和函数的声明，并将它们添加到作用域的顶部，这意味着它们在代码中的实际位置之前被“提升”
3. 如下示例：虽然变量 x 和函数 foo 的声明出现在它们的实际使用之后，但由于变量提升的存在，它们在作用域的顶部被提升，因此代码仍然有效

console.log(x); // undefined

var x = 10;

foo(); // "Hello, world!"

function foo() {

console.log("Hello, world!");

}

变量命名

变量名称必须仅包含字母，数字，符号 $ 和 _。
首字符必须非数字。

保留字

常量

1	const myBirthday = '18.04.1982';

数据类型

在 JavaScript 中有 8 种基本的数据类型（译注：7 种原始类型和 1 种引用类型）
我们可以将任何类型的值存入变量。

// 没有错误

let message = "hello";

message = 123456;

Number类型
1. Infinity、-Infinity 和 NaN。

1 2	let n = 123; n = 12.345;

BigInt类型
1. 在 JavaScript 中，“number” 类型无法表示大于 (253-1)（即 9007199254740991），或小于 -(253-1) 的整数。
2. BigInt 类型是最近被添加到 JavaScript 语言中的，用于表示任意长度的整数。
3. 可以通过将 n 附加到整数字段的末尾来创建 BigInt 值。

1 2	// 尾部的 "n" 表示这是一个 BigInt 类型 const bigInt = 1234567890123456789012345678901234567890n;

String类型
1. 双引号："Hello".
2. 单引号：'Hello'.
3. 反引号：<code>Hello.
4. 双引号和单引号都是“简单”引用，在 JavaScript 中两者几乎没有什么差别。
5. 反引号是 功能扩展 引号。它们允许我们通过将变量和表达式包装在 ${…} 中，将它们嵌入到字符串中。

let str = "Hello";

let str2 = 'Single quotes are ok too';

let phrase = `can embed another ${str}`;

let name = "John";

// 嵌入一个变量

alert( `Hello, ${name}!` ); // Hello, John!

// 嵌入一个表达式

alert( `the result is ${1 + 2}` ); // the result is 3

Boolean类型

let nameFieldChecked = true; // yes, name field is checked

let ageFieldChecked = false; // no, age field is not checked

let isGreater = 4 > 1;

alert( isGreater ); // true（比较的结果是 "yes"）

"null"值
1. 它是一个独立的类型，只包含null值
2. JavaScript 中的 null 仅仅是一个代表“无”、“空”或“值未知”的特殊值。

1	let age = null;

"undefined"值
1. 含义是未被赋值
2. 如果一个变量已被声明，但未被赋值，那么它的值就是 undefined：

let age;

alert(age); // 弹出 "undefined"

let age = 100;

// 将值修改为 undefined

age = undefined;

alert(age); // "undefined"

object类型和symbol类型
1. 其他数据类型都被称为”原始类型“，因为它们的值只包含一个单独的内容（字符串、数字或其他）。object则用于存储数据集合和更复杂的实体。
2. symbol类型用于创建对象的唯一标识符。
typeof运算符
1. 返回参数的类型。
2. 作为运算符：typeof x
3. 函数形式：typeof(x)

typeof undefined // "undefined"

typeof 0 // "number"

typeof 10n // "bigint"

typeof true // "boolean"

typeof "foo" // "string"

typeof Symbol("id") // "symbol"

typeof Math // "object" (1)

//这是官方承认的 typeof 的行为上的错误，这个问题来自于 JavaScript 语言的早期，并为了兼容性而保留了下来。

//null 绝对不是一个 object。null 有自己的类型，它是一个特殊值。

typeof null // "object" (2)

typeof alert // "function" (3)

alert

弹出的这个带有信息的小窗口被称为 模态窗。
“modal” 意味着用户不能与页面的其他部分（例如点击其他按钮等）进行交互，直到他们处理完窗口。

1	alert("Hello");

prompt

title:显示给用户的文本
default:可选的第二个参数，指定 input 框的初始值。
将返回用户在 input 框内输入的文本，如果用户取消了输入，则返回 null

result = prompt(title, [default]);

let test = prompt("Test", ''); // <-- 用于 IE 浏览器

confirm

显示一个带有 question 以及确定和取消两个按钮的模态窗口。
点击确定返回 true，点击取消返回 false。

result = confirm(question);

let isBoss = confirm("Are you the ok?");

alert( isBoss ); // 如果“确定”按钮被按下，则显示 true

"上层"语言
script标签
外部脚本
URL
多个脚本
注意
基础知识一
分号
注释
use strict
变量
变量命名
保留字
常量
数据类型
alert
prompt
confirm

javascript

本文为原创文章，版权归Aet所有，欢迎分享本文，转载请保留出处！

Bingliaolong 关注：0 粉丝：0 最后编辑于：2024-05-14

Everything will be better.