JavaScript笔记Day01-基础知识(一)

1 JavaScript 基础知识 1.1 Hello, world! “script” 标签

我们几乎可以使用

外部脚本

脚本文件可以通过 src 特性（attribute）添加到 HTML 文件中。

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

这里，/path/to/script.js 是脚本文件从网站根目录开始的绝对路径。当然也可以提供当前页面的相对路径。例如，src =“script.js”，就像 src=“./script.js”，表示当前文件夹中的 “script.js” 文件。

我们也可以提供一个完整的 URL 地址，例如：

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

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

这将不会工作：

<script src="file.js">
  alert(1); // 此内容会被忽略，因为设定了 src
</script>

1.2 现代模式，“use strict” “use strict”

当字符串’use strict’处于脚本文件的顶部时，则整个脚本文件都将以“现代”模式进行工作。

确保 “use strict” 出现在脚本的最顶部，否则严格模式可能无法启用。
这里的严格模式就没有被启用：

alert("some code");
// 下面的 "use strict" 会被忽略，必须在最顶部, 多一行空都不行。

"use strict";

// 严格模式没有被激活

只有注释可以出现在 “use strict” 的上面

使用 开发者控制台 运行代码时，请注意它默认是不启动 use strict 的。先输入use strict再shift+enter

1.3 变量

let message = 'Hello!'; // 定义变量，并且赋值

alert(message); // Hello!

也可以在一行中声明多个变量：

let user = 'John', age = 25, message = 'Hello';

//一些程序员采用下面的形式书写多个变量：
let user = 'John',
  age = 25,
  message = 'Hello';

1.4 数据类型 Number 类型

Infinity 代表无穷大

我们可以通过除以 0 来得到它;
或者在代码中直接使用它

alert( 1 / 0 ); // Infinity
alert( -Infinity ); // -Infinity

NaN 代表一个计算错误。Not An Number. 是粘性的(如果在数学表达式中有一个 NaN，会被传播到最终结果（只有一个例外：NaN ** 0 结果为 1）)

String 类型

双引号和单引号都是“简单”引用, 反引号是"功能扩展"引号。它们允许我们通过将变量和表达式包装在 ${…} 中，来将它们嵌入到字符串中
${…} 内的表达式会被计算，计算结果会成为字符串的一部分。可以在 ${…} 内放置任何东西：诸如名为 name 的变量，或者诸如 1 + 2 的算数表达式，或者其他一些更复杂的。

let name = "John";

// 嵌入一个变量
alert( `Hello, ${name}!` ); // Hello, John!

// 嵌入一个表达式
alert( `the result is ${1 + 2}` ); // the result is 3

//使用双引号则不会计算 ${…} 中的内容
alert( "the result is ${1 + 2}" ); // the result is ${1 + 2}

boolean 类型

true 和 false

null 值

它构成了一个独立的类型，只包含 null 值：

let age = null;

undefined 值

含义是 未被赋值

typeof 运算 *** 作符

对 typeof x 的调用会以字符串的形式返回数据类型：

typeof undefined // "undefined"

typeof 0 // "number"

typeof 10n // "bigint"

typeof true // "boolean"

typeof "foo" // "string"

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

typeof Math // "object" (一个内建 object)

typeof null // "object" (null 有自己的类型，它是一个特殊值。typeof 的行为在这里是错误的。)

typeof alert // "function"

typeof(x) 也可行

总结

JavaScript 中有八种基本的数据类型（前七种为基本数据类型primitive types，而 object 为复杂数据类型）。

number 用于任何类型的数字：整数或浮点数，在 ±(253-1) 范围内的整数。
bigint 用于任意长度的整数。
string 用于字符串：一个字符串可以包含 0 个或多个字符，所以没有单独的单字符类型。
boolean 用于 true 和 false。
null 用于未知的值 —— 只有一个 null 值的独立类型。
undefined 用于未定义的值 —— 只有一个 undefined 值的独立类型。
symbol 用于唯一的标识符。
object 用于更复杂的数据结构。

1.5 交互：alert、prompt 和 confirm alert

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

prompt

返回值为字符串, 用来获取用户输入
prompt 函数接收两个参数：
result = prompt(title, [default]);

浏览器会显示一个带有文本消息的modal模态窗口，还有 input 框和确定/取消按钮。

title:显示给用户的文本
default:可选的第二个参数，指定 input 框的初始值。

语法中的方括号 […] 上述语法中 default 周围的方括号表示该参数是可选的，不是必需的。

IE 浏览器会提供默认值

第二个参数是可选的。但是如果我们不提供的话，IE会把 “undefined” 插入到 prompt。
为了 prompt 在 IE 中有好的效果，我们建议始终提供第二个参数：

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

confirm

返回值为布尔值, 用来获取用户判断

1.6 类型转换

转换的函数(?)名为类型的大写,如String()

数字型转换 undefined NaNnull 0true 和 false 1 and 0string 去掉首尾空格后的纯数字字符串中含有的数字。如果剩余字符串为空，则转换结果为 0。否则，将会从剩余字符串中“读取”数字。当类型转换出现 error 时返回 NaN

alert( Number("   123   ") ); // 123
alert( Number("123z") );      // NaN（从字符串“读取”数字，读到 "z" 时出现错误）
alert( Number(true) );        // 1

布尔型转换

转换规则:

直观上为“空”的值（如 0、空字符串(“”)、null、undefined 和 NaN）将变为 false。其他值变成 true。

在 JavaScript 中，非空的字符串总是 true。

alert( Boolean("0") ); // true
alert( Boolean(" ") ); // 空白，也是 true（任何非空字符串都是 true）

1.7 基础运算符，数学

如果一个运算符对应的有n个运算元(参数)，那么它是n元运算符(unary, binary …)

数学

求幂 ** 可用于开方

用二元运算符 + 连接字符串

let s = "my" + "string";
alert(s); // mystring

对于 + ,只要任意一个运算元是字符串，那么另一个运算元也将被转化为字符串

alert( '1' + 2 ); // "12"
alert( 2 + '1' ); // "21"
alert(2 + 2 + '1' ); // "41"
alert('1' + 2 + 2); // "122"

二元 + 是唯一一个以这种方式支持字符串的运算符。其他算术运算符只对数字起作用，并且总是将其运算元转换为数字。

alert( 6 - '2' ); // 4，将 '2' 转换为数字
alert( '6' / '2' ); // 3，将两个运算元都转换为数字

数字转化，一元运算符 +

它的效果和 Number(…) 相同，但是更加简短。

// 转化非数字
alert( +true ); // 1
alert( +"" );   // 0


let apples = "2";
let oranges = "3";

// 在二元运算符加号起作用之前，所有的值都被转化为了数字
alert( +apples + +oranges ); // 5

运算符优先级

一元运算符优先级高于二元运算符

赋值运算符

链式赋值（Chaining assignments）
a = b = c = 2 + 2;

自增/自减

如果我们想要对变量进行自增 *** 作，并且需要立刻使用自增后的值，那么我们需要使用前置形式,否则,用后置

let counter = 1;
let a = ++counter; 

alert(a); // 2

a = counter++; 

alert(a); // 1

关于prompt的问题修正

let a = prompt("First number?", 1);
let b = prompt("Second number?", 2);

alert(a + b); // 12

在 prompt 之前加 +：

let a = +prompt("First number?", 1); // 此时a,b 为数字
let b = +prompt("Second number?", 2);

alert(a + b); // 3

或在 alert 中：

let a = prompt("First number?", 1); // 此时a,b 均为字符串
let b = prompt("Second number?", 2);

alert(+a + +b); // 3

1.8 值的比较

所有比较运算符均返回布尔值
和其他类型的值一样，比较的结果可以被赋值给任意变量

字符串比较

lexicographical顺序进行判定, 后则大

alert( 'Glow' > 'Glee' ); // true

严格相等

严格相等运算符" === "在进行比较时不会做任何的类型转换。
严格不相等”表示为 “!==”

对 null 和 undefined 进行比较

null 只与 undefined 互等

alert( null == undefined ); // true


alert( null > 0 );  //false(0 > 0)
alert( null == 0 ); //false (null == 0)
alert( null >= 0 ); //true (0 >= 0)

undefined 在比较中被转换为了 NaN，而 NaN 是一个特殊的数值型值，它与任何值进行比较都会返回 false。

避免问题 除了严格相等 === 外，其他但凡是有 undefined/null 参与的比较，我们都需要格外小心。除非你非常清楚自己在做什么，否则永远不要使用 >= > < <= 去比较一个可能为 null/undefined 的变量。对于取值可能是 null/undefined 的变量，请按需要分别检查它的取值情况。 总结

比较分三种:

当使用严格相等 === 比较二者时当使用非严格相等 == 比较二者时当使用数学式或其他比较方法 < > <= >= 时：