JavaScript红⽪书学习笔记
1.什么是javaScript
JavaScript 历史回顾
JavaScript 是什么（实现）
JavaScript 是⼀门⽤来与⽹页交互的脚本语⾔，包含以下三个组成部分。
ECMAScript：由 ECMA-262 定义并提供核⼼功能。
⽂档对象模型（DOM）：提供与⽹页内容交互的⽅法和接⼝。
浏览器对象模型（BOM）：提供与浏览器交互的⽅法和接⼝。
JavaScript 与 ECMAScript 的关系
ECMAScript是JavaScript的规格，JavaScript 实现了ECMAScript
JavaScript 的不同版本
2.HTML中的JavaScript
JavaScript 是通过<script>元素插⼊到 HTML 页⾯中的。这个元素可⽤于把JavaScript 代码嵌⼊到
HTML 页⾯中，跟其他标记混合在⼀起，也可⽤于引⼊保存在外部⽂件中的 JavaScript。本章的重点可以总结如下。
要包含外部JavaScript ⽂件，必须将 src 属性设置为要包含⽂件的 URL。⽂件可以跟⽹页在同⼀台服务器上，也可以位于完全不同的域。
所有<script>元素会依照它们在⽹页中出现的次序被解释。在不使⽤ defer 和 async 属性的情况下，包含在<script>元素中的代码必须严格按次序解释。
对不推迟执⾏的脚本，浏览器必须解释完位于<script>元素中的代码，然后才能继续渲染页⾯的剩余部分。为此，通常应该把<script>元素放到页⾯末尾，介于主内容之后及</body>标签之前。
可以使⽤defer 属性把脚本推迟到⽂档渲染完毕后再执⾏。推迟的脚本原则上按照它们被列出的次序执⾏。
可以使⽤ async 属性表⽰脚本不需要等待其他脚本，同时也不阻塞⽂档渲染，即异步加载。异步脚本不能保证按照它们在页⾯中出现的次序执⾏。
通过使⽤<noscript>元素，可以指定在浏览器不⽀持脚本时显⽰的内容。如果浏览器⽀持并启⽤脚本，则<noscript>元素中的任何内容都不会被渲染。
3.语⾔基础
3.1 变量
let 跟 var 最明显的区别是，let 声明的范围是块作⽤域，⽽ var 声明的范围是函数作⽤域。
var函数作⽤域：
if(true){
var name ='Matt';
console.log(name);// Matt
}
console.log(name);// Matt
let块作⽤域：
if(true){
let age =26;
console.log(age);// 26
}
学javascript前要学什么console.log(age);// ReferenceError: age 没有定义
const 的⾏为与 let基本相同，唯⼀⼀个重要的区别是⽤它声明变量时必须同时初始化变量，且尝试修改 const 声明的变量会导致运⾏时错误。
3.2 数据类型
ECMAScript 有 6 种简单数据类型（也称为原始类型）：Undefined、Null、Boolean、Number、String 和 Symbol。Symbol（符号）
是ECMAScript 6 新增的。
还有⼀种复杂数据类型叫 Object（对象）。Object 是⼀种⽆序名值对的集合。
typeof操作符
因为 ECMAScript 的类型系统是松散的，所以需要⼀种⼿段来确定任意变量的数据类型。typeof操作符就是为此⽽⽣的。对⼀个值使⽤typeof 操作符会返回下列字符串之⼀：
"undefined"表⽰值未定义；
"boolean"表⽰值为布尔值；
"string"表⽰值为字符串；
"number"表⽰值为数值；
"object"表⽰值为对象（⽽不是函数）或 null；
"function"表⽰值为函数；
"symbol"表⽰值为符号。
下⾯是使⽤ typeof 操作符的例⼦：
let message ="some string";
console.log(typeof message);// "string"
console.log(typeof(message));// "string"
console.log(typeof95);// "number"
在这个例⼦中，我们把⼀个变量（message）和⼀个数值字⾯量传给了 typeof 操作符。注意，因为 typeof 是⼀个操作符⽽不是函数，所以不需要参数（但可以使⽤参数）。
注意typeof在某些情况下返回的结果可能会让⼈费解，但技术上讲还是正确的。⽐如，调⽤typeof null 返回的是"object"。这是因为特殊值 null 被认为是⼀个对空对象的引⽤。
在其他地⽅看到前端判断数据类型的⽅法：
[外链图⽚转存失败，源站可能有防盗链机制，建议将图⽚保存下来直接上传(img-99ATwSTN-1610439473146)
(blob:file:///8740607f-d149-4616-8e5e-292f4bc32df4)]
Undefined类型
⚠ ：即使未初始化的变量会被⾃动赋予 undefined 值，但我们仍然建议在声明变量的同时进⾏初始化。这样，当 typeof 返回"undefined"时，你就会知道那是因为给定的变量尚未声明，⽽不是声明了但未初始化。
Null类型
Null 类型同样只有⼀个值，即特殊值 null。逻辑上讲，null 值表⽰⼀个空对象指针，这也是给
typeof 传⼀个 null 会返回"object"的原因：
let car =null;
console.log(typeof car);// "object"
Boolean类型
Boolean()转型函数可以在任意类型的数据上调⽤，⽽且始终返回⼀个布尔值。什么值能转换为 true
或 false 的规则取决于数据类型和实际的值。下表总结了不同类型与布尔值之间的转换规则。
数据类型转换为 true 的值转换为 false 的值
Boolean true false
String⾮空字符串“”（空字符串）
Number⾮零数值（包括⽆穷值）0、NaN（参见后⾯的相关内容）
Object任意对象null
Undefined N/A（不存在）undefined
Number 类型
1. 浮点值
要定义浮点值，数值中必须包含⼩数点，⽽且⼩数点后⾯必须⾄少有⼀个数字。永远不要测试某个特定的浮点值
if(a + b ==0.3){// 别这么⼲！
console.log("You got 0.3.");
}
2. 值的范围
由于内存的限制，ECMAScript 并不⽀持表⽰这个世界上的所有数值。ECMAScript 可以表⽰的最⼩数值保存在
Number.MIN_VALUE 中，这个值在多数浏览器中是 5e 324；可以表⽰的最⼤数值保存在Number.MAX_VALUE 中，这个值在多数浏览器中是 1.797 693 134 862 315 7e+308。如果某个计算得到的数值结果超出了 JavaScript 可以表⽰的范围，那么这个数值会被⾃动转换为⼀个特殊的 Infinity（⽆穷）值。
3. NaN
NaN 不等于包括 NaN 在内的任何值。例如，下⾯的⽐较操作会返回 false：
console.log(NaN==NaN);// false
4. 数值转换
有 3 个函数可以将⾮数值转换为数值：Number()、parseInt()和 parseFloat()
Number()是转型函数，可⽤于任何数据类型。后两个函数主要⽤于将字符串转换为数值。
String 类型
String（字符串）数据类型表⽰零或多个 16 位 Unicode 字符序列。字符串可以使⽤双引号（"）、
单引号（’）或反引号（`）标⽰，因此下⾯的代码都是合法的：
let firstName ="John";
let lastName ='Jacob';
let lastName =`Jingleheimerschmidt`
转换为字符串
1. toString()⽅法
⚠ ：toString()⽅法可见于数值、布尔值、对象和字符串值。（没错，字符串值也有 toString()⽅法，该⽅法只是简单地返回⾃⾝的⼀个副本。）null 和 undefined 值没有 toString()⽅法。
let age =11;
let ageAsString = String();// 字符串"11"
let found =true;
let found =true;
let foundAsString = String();// 字符串"true"
2. String()转型函数
⚠ ：如果你不确定⼀个值是不是 null 或 undefined，可以使⽤ String()转型函数，它始终会返回表⽰相应类型值的字符串。
let value1 =10;
let value2 =true;
let value3 =null;
let value4;
console.log(String(value1));// "10"
console.log(String(value2));// "true"
console.log(String(value3));// "null"
console.log(String(value4));// "undefined"
⽤加号操作符给⼀个值加上⼀个空字符串""也可以将其转换为字符串
模板字⾯量
ECMAScript 6 新增了使⽤模板字⾯量定义字符串的能⼒。与使⽤单引号或双引号不同，模板字⾯量保留换⾏字符，可以跨⾏定义字符串：
let myMultiLineString ='first line\nsecond line';
let myMultiLineTemplateLiteral =`first line
second line`;
console.log(myMultiLineString);
// first line
// second line"
console.log(myMultiLineTemplateLiteral);
// first line
// second line
console.log(myMultiLineString === myMultiLinetemplateLiteral);// true
字符串插值
字符串插值通过在${}中使⽤⼀个 JavaScript 表达式实现：
let value =5;
let exponent ='second';
// 以前，字符串插值是这样实现的：
let interpolatedString =
value +' to the '+ exponent +' power is '+(value * value);
/
/ 现在，可以⽤模板字⾯量这样实现：
let interpolatedTemplateLiteral =
`${ value } to the ${ exponent } power is ${ value * value }`;
console.log(interpolatedString);// 5 to the second power is 25
console.log(interpolatedTemplateLiteral);// 5 to the second power is 25
Symbol 类型
Symbol（符号）是 ECMAScript 6 新增的数据类型。符号是原始值，且符号实例是唯⼀、不可变的。符号的⽤途是确保对象属性使⽤唯⼀标识符，不会发⽣属性冲突的危险。
Object 类型
ECMAScript 中的对象其实就是⼀组数据和功能的集合。对象通过 new 操作符后跟对象类型的名称
来创建。开发者可以通过创建 Object 类型的实例来创建⾃⼰的对象，然后再给对象添加属性和⽅法：
let o = new Object();
3.3操作符
⼀元操作符
只操作⼀个值的操作符叫⼀元操作符（unary operator）
（1）递增/递减操作符（a++或–a）
（2）⼀元加和减（a=+a或a=-a）
（3）位操作符（按位⾮（～）， 按位与（&），按位或（|）， 按位异或（^），左移（<<），右移（>>），⽆符号右移（>>>））
布尔操作符
布尔操作符⼀共有 3 个：逻辑⾮(!)、逻辑与(&&)和逻辑或(||)。
乘性操作符
ECMAScript 定义了 3 个乘性操作符：乘法（*）、除法（/）和取模（%）。
指数操作符
ECMAScript 7 新增了指数操作符，Math.pow()现在有了⾃⼰的操作符**，结果是⼀样的：
console.log(Math.pow(3,2);// 9
console.log(3**2);// 9
不仅如此，指数操作符也有⾃⼰的指数赋值操作符**=，该操作符执⾏指数运算和结果的赋值操作：
let squared =3;
squared **=2;
console.log(squared);// 9
加性操作符
加性操作符，即加法（+）和减法（-）操作符，⼀般都是编程语⾔中最简单的操作符。加性操作符在后台会发⽣不同数据类型的转换。
关系操作符
关系操作符执⾏⽐较两个值的操作，包括⼩于（<）、⼤于（>）、⼩于等于（<=）和⼤于等于（>=），
⽤法跟数学课上学的⼀样。
相等操作符
ECMAScript提供了两组操作符。第⼀组是等于和不等于，它们在⽐较之前执⾏转换。第⼆组是全等和不全等，它们在⽐较之前不执⾏转换。
（1）等于和不等于
ECMAScript 中的等于操作符⽤两个等于号（==）表⽰，如果操作数相等，则会返回 true。不等于操作符⽤叹号和等于号（!=）表⽰，如果两个操作数不相等，则会返回 true。这两个操作符都会先进⾏类型转换（通常称为强制类型转换）再确定操作数是否相等。
（2）全等和不全等
全等和不全等操作符与相等和不相等操作符类似，只不过它们在⽐较相等时不转换操作数。全等操
作符由 3 个等于号（===）表⽰，只有两个操作数在不转换的前提下相等才返回 true，⽐如：
let result1 =("55"==55);// true，转换后相等
let result2 =("55"===55);// false，不相等，因为数据类型不同
条件操作符
条件操作符是 ECMAScript 中⽤途最为⼴泛的操作符之⼀，语法跟 Java 中⼀样：

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。