Javascript基础（一）
Javascript基礎（一）
- 引用：
- 輸出
- 字節與字符的區別
- 字面量
- 變量
- 操作符
- 語句
- 注釋
- 數據類型：基本類型、引用類型
- 類型檢測
- 字符串
- 對象
- 函數
- 作用域
- 局部變量|全局變量
- 提升
引用：
a）引入外部文件：
<script src="js/index.js" type="text/javascript"></script>b）頁頭引入 c）頁中引入 d）元素事件中引入：
<!DOCTYPE html> <html> <head><title></title>// 頁頭引入, 需要快速加載的內容<script type="text/javascript">function alertMessage() {}</script> </head> <body><input type="button" onclick="alertMessage()" value="按鈕"/>// 不推薦，頁中引入<script type="text/javascript">function alertMessage() {}</script>// 元素事件中引入<input type="button" οnclick="alert("綠葉學習網");" value="按鈕"/>// 推薦，頁尾引入, 不影響頁面結構樣式加載的速度<script type="text/javascript">function alertMessage() {}</script> </body> </html>輸出
輸出數據的方式：
a）window.alert() 彈框輸出b) document.write() 將內容寫到HTML文檔流中c) innerHTML寫入HTML元素中d）console.log() 寫到瀏覽器的控制臺字節與字符的區別
字節(Byte)是計量單位，表示數據量多少，是計算機信息技術用于計量存儲容量的一種計量單位，通常情況下一字節等于八位。
字符(Character)計算機中使用的字母、數字、字和符號。一般在英文狀態下一個字母或字符占用一個字節，一個漢字用兩個字節表示。
字節與字符：
ASCII 碼中，一個英文字母（不分大小寫）為一個字節，一個中文漢字為兩個字節。
UTF-8 編碼中，一個英文字為一個字節，一個中文為三個字節。
Unicode 編碼中，一個英文為一個字節，一個中文為兩個字節。
符號：英文標點為一個字節，中文標點為兩個字節。例如：英文句號 . 占1個字節的大小，中文句號 。占2個字節的大小。
UTF-16 編碼中，一個英文字母字符或一個漢字字符存儲都需要 2 個字節（Unicode 擴展區的一些漢字存儲需要 4 個字節）。
UTF-32 編碼中，世界上任何字符的存儲都需要 4 個字節。
字面量
固定值稱字面量，字面量是一個恒定的值**
a) 數字NUmber： 整數、小數、科學計數eb) 字符串String：使用單引號或者雙引號c) 表達式： 用于計算d) 數組Array：[]e) 對象Object：{}f) 函數：function變量
用于存儲數據值，變量是一個名稱**
a) 定義：用var、let、cont 來定義，用等號（=）來賦值
操作符
a) 算術、位運算符：+ - * / %(取模，余數) ++(自增) --(自減) b) 賦值運算符: = += -= *= /= %= c) 條件、比較、邏輯運算符： == != < > <= >= === !== d) 邏輯運算符：&& || ! // 字符串和數值相加變成組合字符串語句
向瀏覽器發出命令，用分號分隔。**
5）關鍵字：用于標識要執行的操作。eg: if else int var…
注釋
a) 單行注釋： // ... b) 多行注釋： /* ... */數據類型：基本類型、引用類型
ECMAScirpt 變量有兩種不同的數據類型：基本類型（原始類型），引用類型（對象類型）。
基本類型：undefined null bollean string number symbol bigInt
Undefined： 一個沒有被賦值的變量的默認值
Null：是一個只有一個值的特殊類型，表示一 個空對象引用。可以通過將變量的值設置為 null 來清空變量。
Boolean布爾類型： true、false
Number數字類型： 分為正數和負數
String字符串類型： 用于表示文本數據。它是一組16位的無符號整數值的“元素”。在字符串中的每個元素占據了字符串的位置。第一個元素的索引為0，下一個是索引1，依此類推。字符串的長度是它的元素的數量。
BigInt: 用任意精度表示整數。可以安全地存儲和操作大整數，甚至可以超過數字的安全整數限制
Symbol符號類型：符號類型是唯一且不可修改的，可以用來作為Object的key的值
基本類型特征：
a) 基本類型的值是不可變的，（操作后返回的都是新值，原始的被銷毀了）
b）比較是它們的值的比較
c) 數據類型不同的進行比較，自動進行了數據類型的隱式轉換。 == 只進行值的比較 ， ===不僅進行值得比較，還要進行數據類型的比較
d) 基本類型的變量是存放在棧內存（Stack）里的
引用類型： Object Array Date RegExp Function
引用類型的特征：
a) 值是可變的
b) 比較是引用的比較
c) 引用類型的值是保存在堆內存（Heap）中的對象（Object）
類型檢測
類型檢測： typeof、instanceof、constructor屬性
a) typeof 只能用于檢測基本類型的數據，引用類型檢測結果都是Object。能檢測出的類型： undefinde null boolean string number symbol object function
var a; typeof a; // undefined a = null; typeof a; // object a = true; typeof a; // boolean a = 666; typeof a; // number a = "hello"; typeof a; // string a = Symbol(); typeof a; // symbol a = function(){} typeof a; // function a = []; typeof a; // object a = {}; typeof a; // object a = /aaa/g; typeof a; // object undefined 和 null 的區別 typeof undefined // undefined typeof null // object null === undefined // false null == undefined // trueb) instanceof 檢測一個引用類型的變量具體是哪中類型
({}) instanceof Object // true ([]) instanceof Array // true (/aa/g) instanceof RegExp // true (function(){}) instanceof Function // truec) constructor屬性：（推薦）
返回所有變量的構造函數
字符串
a) 字符串語法：
var str = 'hello'; var str = "hello"; var str = "'hello I'm Lotus" //字符串引號與內容引號不同 var str = 'hello I\'m Lotus' //轉義字符 var str = "hello \" Lotus\"" // 特殊字符： \' 單引號 \" 雙引號 \\ 反斜杠 \n 換行 \r 回車 \t tab制表符 \b 退格符 \f 換頁符b) 字符串屬性和方法：
length： 計算返回字符串長度
var str = "Lotus"; var str1 = ' hello "小微"' document.write(str.length); // 5 document.write(str1.length); // 11chartAt(): 返回指定索引位置的字符
chartCodeAt(): 返回指定所以位置的Unicode值
concat() ： 字符串連接，返回連接后的字符串
indexOf() ：返回查找指定字符第一次出現的位置
lastIndexOf() ： 返回查找指定字符最后一次出現的位置
match() ：找到一個或者多個正則表達式的匹配
replace() ：替換與正則表達式匹配的子串
search() ：檢索與正則表達式相匹配的值
slice()：返回提取的字符串片段
split() ：把字符串分隔為子字符串數組
substr() ：從起始索引提取字符串中指定數目的字符
substring()：提取字符串兩個指定的索引之間的字符
toLowerCase()：把字符串轉為小寫
toUpperCase() ：把字符串轉為大寫
toString() ：返回字符串對象值
trim() ：移除字符串首尾空白
valueOf() ：返回某個字符串對象的原始值
let str = "hello lotus"; document.write(str.charAt(1)); // e document.write(str.charCodeAt(1)); // 101let str1 = 'hello wang'; document.write(str.concat(str1)); //hello lotushello wang document.write(str.concat(str1, 'abc', '123')); // hello lotushello wangabc123 document.write(str); // hello lotus對象
擁有屬性和方法的數據。對象也是一個變量，但對象可以包含多個值（多個變量)。我們常認為對象是鍵值對的容器。
a) 對象定義：
<script>var person = {firstName:"John", lastName:"Doe", age:50}; </script>b) 鍵值對：name: value,通常稱為對象屬性。
c) 訪問對象屬性：
<script>var person = {firstName:"John", lastName:"Doe", age:50};// 1） let name = person.firstName + person.lastName；let age = person.age;// 2) let name = person['firstName'] + person['lastName']let age = person["age"]; </script>d) 對象方法：對象的方法定義了一個函數，并作為對象的屬性存儲。訪問方法的區別是多一個()，作為函數。
<script>let obj = {name: 'lotus',age: 24,hover: function () {alert('eat')},fullInfo: function () {return this.name + this.age;}}obj.hover()document.write(obj.fullinfo()); </script>函數
是由事件驅動或者被調用時執行的可重復執行的代碼塊。是可以通過外部代碼調用的一個 “子程序”。每個函數都是一個Function對象
a) 函數定義：
函數聲明：通過關鍵字function定義，把函數作為變量來聲明。函數聲明后不會立即執行，會在我們需要的時候調用到
<script>function myFunction(a, b) {return a * b;}// js對大小寫敏感，function必須小寫，調用時大小寫也必須一致。// 函數聲明不是一個可執行語句，所以不 以分號結尾。 </script>函數表達式：可以存儲在變量中
var x = function (a, b) {return a * b}; var y = x(1, 2); // 函數表達式存儲在變量后，變量也可作為一個函數使用 // 以上沒有名稱的函數是一個匿名函數構造函數:通過內置函數構造器Function()來定義。
let a = new Function('a', 'b', 'return a + b'); let b = a(1, 2); document.write(a); //function anonymous(a,b ) { return a + b } document.write(b); // 3b）函數的參數：調用函數時，傳遞的值就叫參數，供在函數中使用。
多個參數由逗號（,）分隔；
c) 帶返回值的函數：使用return語句返回值；執行return時函數會停止執行，并返回指定的值。
<script>function way(a, b) {return a + b;}let c = way(2, 3); // 5; </script> <script>function way(a, b) {return a > b;}let c = way(2, 3); // false; </script> <script>let c = 0;function way(a, b) {if (a < b) {return;};c = a + b;}let c = way(2, 3); // undefined;document.write(c); // 5 </script>作用域
作用域為可訪問變量、對象、函數的集合。
局部作用域：在函數內聲明，變量為局部作用域。
全局作用域：網頁中所有腳本和函數。
局部變量：在函數內聲明的變量 | 函數接收的參數，只能在函數內部訪問。
全局變量：在函數外聲明 | 函數內沒定義直接賦值的變量
局部變量|全局變量
a) 局部變量：在函數內部聲明的變量（使用 var），只能在函數中使用，該變量的作用域是局部的。
b) 全局變量：在函數外聲明的變量，網頁上所有腳本和函數都能訪問它。
變量的生命周期：從被聲明的時候開始，局部變量會在函數執行結束后被刪除，全局變量會在頁面關閉后刪除。
c) 向未聲明的變量賦值：該變量自動被當作window的一個屬性。即成為全局變量。
<script>let a = 0, b = 1; // 全局let c = 4;function way() {let a = 2, b = 3; // 局部c = 6;d = 5;document.write(a,b); // 2, 3document.write(c); // 6document.write(d); // 5}way();document.write(a,b); // 0,1document.write(c); // 6document.write(d); // 5 </script>d) 對非正規聲明的全局變量可以通過delete來刪除：
<script>let a = 0; // 全局c = b;delete a; // 報錯console.log(a); // 0delete b; // trueconsole.log(b); // </script>提升
變量提升：
a) 函數和變量的聲明都能被提升到函數的最頂部。
b) 變量可以使用后再聲明
c) 聲明變量，變量提升，值不會提升
a = 5; //變量設置 var a; // 聲明a document.write(a); //5document.write(b); //undefined var b = 5; // 聲明b document.write(b); // 5 // 嚴格模式中，不允許使用未聲明的變量函數提升：
a) 函數聲明的時候得到提升
b) 函數表達式不會得到提升
way(); // 2,3function way() {let a = 2, b = 3; // 局部document.write(a,b); // 2, 3}way(); // 2,3總結
以上是生活随笔為你收集整理的Javascript基础（一）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 如何将Eclipse设置为中文版
- 下一篇： Java探索之旅(6)——对象和类