[TOC]
# 每日單詞
1. `pretty` 可愛
1. `format` 格式化
1. `insert` 插入
1. `upper` 單詞大寫
1. `lower` 單詞小寫
1. `Infinity` 無限
# 再談函數
## 聲明后即運行
先聲明在調用
```javascript
function hello() {
console.log("hello world");
}
hello();
```
聲明及時調用
```javascript
(function hello() {
console.log("hello world");
})();
(function() {
console.log("hello world");
})();
```
## 對象的屬性
> 對象只有屬性, 當一個對象的屬性的內容恰好是函數的時候, 我們把它叫做對象的方法
```javascript
var obj = {
userName: "Xujunhao",
hello: function() {
console.log("hello world");
}
};
obj.hello(); // 調用函數, 輸出"hello world"
```
```javascript
var obj = {
userName: "Xujunhao",
hello: function() {
console.log("hello world");
}
};
function loveYou() {
return "I love you";
}
obj.loveYou = loveYou(); // 獲取函數的返回值, 賦值給對象的屬性
```
```javascript
var obj = {
userName: "Xujunhao",
hello: function() {
console.log("hello world");
}
};
function loveYou() {
return "I love you";
}
obj.loveYou = loveYou; // 把函數的整個內容, 賦值給對象的屬性
console.log(obj.loveYou()); // 輸出 I love you
```
## 函數進階
> 函數的返回值, 可以是個函數
```javascript
function hello() {
return hello1;
}
function hello1() {
return hello2;
}
function hello2() {
console.log("hello world");
}
hello()()(); // "hello world"
```
# js 的一行, 和 html 的一行
> js 的一行, 可以理解成整個 js 文件
```javascript
hello(); // 輸出hello world, 不會因為先調用而報錯
function hello() {
console.log("hello world");
}
```
> html 的一行, 可以理解成一個標簽
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
</head>
<body>
<script>
hello(); // 因為調用時, 沒有聲明hello函數, 所以報錯
</script>
<script src="test2.js"></script>
</body>
</html>
```
> test2.js
```javascript
function hello() {
console.log("hello world");
}
```
# 回顧數據類型, 穿插強制類型數據轉換
> 注意:js 三種引入方式, 不能混用
## typeof 操作符
typeof 操作符的作用?
> 顯示數據類型
typeof 操作符, 可以返回多少類型?
1. undefined —— 如果這個值未定義;
1. boolean —— 如果這個值是布爾值;
1. string —— 如果這個值是字符串;
1. number —— 如果這個值是數值;
1. object —— 如果這個值是對象,arr,null ;
1. function —— 如果這個值是函數。
```javascript
console.log(typeof a); // undefined
console.log(typeof 123); // number
console.log(typeof "123"); // string
console.log(typeof true); // boolean
console.log(typeof false); // boolean
console.log(typeof {}); // object
function hello() {
console.log("hello");
}
console.log(typeof hello); // function
console.log(typeof hello()); // undefined, 函數沒有返回值的話, typeof檢測為undefined
console.log(typeof []); // array是特殊的object
console.log(typeof undefined); // undefined
console.log(typeof null); // object
```
typeof 的另一種寫法
```javascript
console.log(typeof 123); // number
console.log(typeof 123); // number
```
## Undefined 類型
什么是 undefined?
> 變量未定義時返回 undefined
未賦值的變量, 默認值就是 undefined
```javascript
var a;
console.log(typeof a); // undefined
var b = undefined;
console.log(b); // undefined
```
如果未聲明會怎樣?
```javascript
var a;
console.log(typeof a); // undefined
var b = undefined;
console.log(typeof b); // undefined
console.log(typeof c); // undefined
```
如何區別未聲明和未賦值?
```javascript
var userName = "";
var userAge = 0;
// var userObj = {};
console.log(typeof a); // string
console.log(typeof c); // undefined
```
> 初始值的目的, 第一區分未賦值和未定義, 第二監控數據的變化
## Null 類型
什么是 Null 類型
> 空對象
> 如果定義的變量準備在將來用于保存對象,那么最好將該變量初始化為 null 而不是其他值
```javascript
var userName = "";
var userAge = 18;
var userObj = null; // 對象的初始值, 建議null
console.log(Boolean(userObj)); // false
```
## Boolean 類型
什么是 Boolean 類型?
> 真或假 true or false
注意 true 和 True(python)
```javascript
console.log(typeof True); // undefined
console.log(typeof true); // boolean
```
任何其他數據類型,都可以強制類型轉換到 Boolean(使用 Boolean())
1. undefined ==> boolean
1. string ==> boolean
1. number ==> boolean
1. object ==> boolean
1. function ==> boolean
```javascript
console.log(Boolean(undefined)); // false
console.log(Boolean(null)); // false
console.log(Boolean("")); // false
console.log(Boolean("hello")); // true
console.log(Boolean(0)); // false
console.log(Boolean(123)); // true
console.log(Boolean(0.0)); // false
console.log(Boolean([])); // true
console.log(Boolean({})); // true
```
不管函數有沒有內容, 一律是 true
```javascript
function hello() {
console.log();
}
console.log(Boolean(hello)); // true
```
```javascript
function hello() {}
console.log(Boolean(hello)); // true
```
## Number 類型
什么是數字類型
> 整數和浮點數
> 聲明數字類型時的進制問題
```javascript
console.log(123); // 123
console.log(088); // 88
console.log(070); // 56 前面有0, 代表8進制
console.log(0x70); // 112 前面有0x, 代表16進制
```
浮點數的".1"和"1."
保存浮點數值需要的內存空間是保存整數值的兩倍, 所以 1.0 會轉成 1
```javascript
console.log(1.1); // 1.1
console.log(1.0); // 1
console.log(0.1); // 0.1
console.log(1); // 1
```
如果是一個極小的數(科學計數法)
如果是一個極大的數呢?(科學計數法)
```javascript
console.log(0.00000000000000001); // 1e-17
console.log(0.001); // 0.001
console.log(0.0000001); // 7位會轉科學計數法
console.log(1000000000000000000000000000); // 1e+27
console.log(1000000000000000000000); // 21位轉科學計數法
```
浮點數的比較問題
不要比較浮點數, 容易出事兒
```javascript
// 0.1+0.2 = 0.3
console.log(0.1 + 0.2); // 0.30000000000000004
console.log(Boolean(0.1 + 0.2 == 0.3)); // false
```
數值范圍問題
```javascript
console.log(Number.MAX_VALUE);
console.log(1.7976931348623157e30899); // Infinity
console.log(1.7976931348623157e30899 + 10); // Infinity
console.log(-1.7976931348623157e30899 + 10); // -Infinity
console.log(Number.MAX_SAFE_INTEGER); // 9007199254740991
console.log(9007199254740992); // 9007199254740992, 最大安全整數, 保質期
```
什么是 NaN
> 不是數字, js 解釋器想要一個數字, 結果沒有得到數字的時候, 就會報 NaN
> 除以 0 的問題
```javascript
console.log(1 / 0); // Infinity
console.log(-1 / 0); // -Infinity
console.log(0 / 0); // NaN
```
任何涉及 NaN 的操作(例如 NaN /10)都會返回 NaN
```javascript
console.log(NaN / 0); // NaN
console.log(NaN / NaN); // NaN
console.log(100 / 100); // 1
console.log(10 / NaN); // NaN
console.log(NaN / 10); // NaN
console.log(NaN * 0); // NaN
console.log(NaN * NaN); // NaN
console.log(10 * NaN); // NaN
console.log(NaN * 10); // NaN
console.log(Boolean(100 == 100)); // true
console.log(Boolean(NaN == NaN)); // false
```
NaN 與任何值都不相等,包括 NaN 本身
```javascript
console.log(Boolean(NaN == NaN)); // false
console.log(Boolean(NaN == 10)); // false
```
數字的強制類型轉換
有 3 個函數可以把非數值轉換為數值: Number() 、 parseInt() 和 parseFloat() 。
? Number() 可以用于任何數據類型
? 另兩個函數則專門用于把字符串轉換成數值。這 3 個 函數對于同樣的輸入會有返回不同的結果。
Number()規則
```javascript
console.log(Number("123")); // 123
console.log(Number("123.00")); // 123
console.log(Number("00123")); // 123
console.log(Number("0123")); // 123
console.log(Number("123hello")); // NaN
console.log(Number([])); // 0
console.log(Number({})); // NaN
function hello() {}
console.log(Number(hello)); // NaN
```
```javascript
console.log(Number(true)); //1
console.log(Number(false)); //0
```
1. 如果是 Boolean 值, true 和 false 將分別被轉換為 1 和 0。
1. 如果是數字值,只是簡單的傳入和返回。
1. 如果是 null 值,返回 0。
1. 如果是 undefined ,返回 NaN 。
```javascript
console.log(Number(123)); // 123
console.log(Number(null)); // 0
console.log(Number(undefined)); // NaN
console.log(Number(NaN)); // NaN
```
1. 如果是字符串,遵循下列規則:
1. 如果字符串中只包含數字(包括前面帶正號或負號的情況),則將其轉換為十進制數值,即 "1" 會變成 1, "123" 會變成 123,而 "011" 會變成 11(注意:前導的零被忽略了);
1. 如果字符串中包含有效的浮點格式,如 "1.1" ,則將其轉換為對應的浮點數值(同樣,也會忽略前導零);
```javascript
console.log(Number(123.333)); // 123.333
console.log(Number(0.1)); // 0.1
```
1. 如果字符串中包含有效的十六進制格式,例如 "0xf" ,則將其轉換為相同大小的十進制整數值;
```javascript
console.log(Number("0xf")); // 15
console.log(Number("070")); // 70
```
1. 如果字符串是空的(不包含任何字符),則將其轉換為 0;
```javascript
console.log(Number("")); // 0
```
1. 如果字符串中包含除上述格式之外的字符,則將其轉換為 NaN 。
```javascript
console.log(Number(070)); // 56
console.log(070); // 56
console.log(Number("070")); // 70
console.log(Number("0x70")); // 112
console.log(Number("12.11")); // 12.11
console.log(Number("012.11")); // 12.11
```
1. 如果是對象,則調用對象的 valueOf()方法,然后依照前面的規則轉換返回的值。如果轉換的結果是 NaN,則調用的對象的 toString()方法,然后再次依照前面的規則轉換返回的字符串值。
轉整數, 推薦 parseInt()
```javascript
console.log(parseInt("0123")); // 123
console.log(parseInt("0.123")); // 0
console.log(parseInt("123hello")); // 123
```
轉小數, 推薦 parseFloat()
```javascript
console.log(parseFloat("0123")); // 123
console.log(parseFloat("0.123")); // 0.123
console.log(parseFloat("123hello")); // 123
console.log(parseFloat("1.00")); // 1
```
引號與解析變量
關于轉義
> 轉變含義
\n 換行
```javascript
var a = "I love \n China";
// I love
// China
console.log(a);
```
\t 制表
```javascript
var a = "I love\tChina";
var b = "I love China";
console.log(a); // I love China
console.log(b); // I love China
```
\b 空格(存在兼容性問題)
\r 回車 (windows 里, \r\n 表示一個回車)
\\ 斜杠
```javascript
var a = "I love \\China";
console.log(a); // I love \China
```
\' 單引號( ' ),在用單引號表示的字符串中使用。例如: 'He said, \'hey.\''
\" 雙引號( " ),在用雙引號表示的字符串中使用。
```javascript
var a = "I love China";
var b = "I love 'China'";
var c = 'I love "China"';
var d = 'I love "China"';
console.log(a); // I love China
console.log(b); // I love 'China'
console.log(c); // I love "China"
console.log(d); // I love "China"
```
獲取字符的長度
```javascript
var a = [1, 2, 3];
console.log(a.length); //3
var b = "I love China";
console.log(b.length); // 12
var b = "I love\tChina";
console.log(b.length); // 12 \t當成一個
var c = "I love 'China'";
console.log(c.length); // 14
var d = "I love 'China'";
console.log(d.length); // 14 轉義當一個字符
```
轉字符串
toString(), 幾乎每種類型都有, 除了 null 和 undefined
```javascript
var a = 123;
console.log(typeof a.toString()); // string
console.log(a.toString()); // 123
var b = 0xff;
console.log(b.toString()); // 255
console.log(typeof b.toString()); // string
var c = 070;
console.log(c.toString()); // 56
console.log(typeof c.toString()); // string
```
```javascript
var a = null;
console.log(a.toString());
var b;
console.log(b.toString());
```
String()
1. 如果值有 toString() 方法,則調用該方法(沒有參數)并返回相應的結果;
1. 如果值是 null ,則返回 "null" ;
1. 如果值是 undefined ,則返回 "undefined" 。
```javascript
var a = null;
console.log(String(a)); // null
console.log(typeof String(a)); // string
var b;
console.log(String(b)); // undefined
console.log(typeof String(b)); // string
```
第三種方法,+""
```javascript
var a = 123;
console.log(typeof (a + "")); // string
console.log(123 + "123hello"); // 123123hello
```
## Object 類型
創建對象和數組的"三種"方式
```javascript
var arr = [];
var arr1 = new Array();
var arr2 = new Array();
console.log(typeof arr); // object
console.log(typeof arr1); // object
console.log(typeof arr2); // object
var obj = {};
var obj1 = new Object();
var obj2 = new Object();
console.log(typeof obj); // object
console.log(typeof obj1); // object
console.log(typeof obj2); // object
```
# 變量作用域
什么是作用域
> 變量的勢力范圍
某個執行環境中的所有代碼執行完畢后,該環境被銷毀,保存在其中的所有變量和函數定義也隨之銷毀
```javascript
var a;
function hello() {
a = "hello";
}
hello();
console.log(a);
```
var 聲明局部變量
- 每日單詞
- JavaScript 入門
- JavaScript 基礎
- JavaScript 基礎回顧
- JavaScript 函數
- 匿名函數,多維數組,數據類型轉換
- JavaScript 類型轉換, 變量作用域
- js 運算符(一)
- js 運算符(二)
- js 流程控制語句
- JavaScript 掃盲日
- JavaScript 牛刀小試(一)
- JavaScript 牛刀小試(二)
- JavaScript 再談函數
- JavaScript-BOM
- JavaScript-定時器(一)
- JavaScript-定時器(二)
- 番外-輪播圖源碼
- JavaScript 輪播圖和 DOM 簡介
- JavaScript-DOM 基礎-NODE 接口-屬性
- JavaScript-DOM 基礎-NODE 接口-方法
- NodeList-接口-HTMLCollection-接口
- Document 節點
- CSS 復習與擴展(一)
- CSS 復習與擴展(二)
- 走進 jQuery 的世界
- 使用 jquery
- 使用 jquery-2
- jquery 中高級
- jquery 備忘清單-1
- jquery 備忘清單-2
- 聊聊 json
- jquery 備忘清單-3