JavaScript基礎學習（一）

值型別(基本型別)：字串（String）、數字(Number)、布爾(Boolean)、對空（Null）、未定義（Undefined）、Symbol，

注：Symbol 是 ES6 引入了一種新的原始資料型別，表示獨一無二的值，

參考資料型別：物件(Object)、陣列(Array)、函式(Function)，

js中  var name="Volvo XC60";        var name='Volvo XC60';    '  '  與 " " 作用是相同的  

=== 為絕對相等，即資料型別與值都必須相等，

JavaScript 陣列

下面的代碼創建名為 cs 的陣列：

或者 (condensed array):

或者 (literal array): 　例；var cs=["Saab","Volvo","BMW"];

JavaScript 物件

物件由 {  } 分隔，在括號內部，物件的屬性以名稱和值對的形式 (name : value) 來定義，

屬性由逗號分隔：    var test={name:"John", three:"Doe", id:666};

 "JavaScript 物件是變數的容器"，但是，我們通常認為 "JavaScript 物件是鍵值對的容器"，

鍵值對通常寫法為 name : value (鍵與值以冒號分割)，鍵值對在 JavaScript 物件通常稱為 物件屬性，

通常 fullName() 是作為 person 物件的一個方法， fullName 是作為一個屬性，

如果使用 fullName 屬性，不添加 (), 它會回傳函式的定義（函式運算式）；添加括號輸出函式執行結果

document.getElementById("demo1").innerHTML = "不加括號輸出函式運算式：" + person.fullName;           不加括號輸出函式運算式：function() { return this.firstName + " " + this.lastName; }
document.getElementById("demo2").innerHTML = "加括號輸出函式執行結果：" + person.fullName();     加括號輸出函式執行結果：test  java

區域 JavaScript 變數

在 JavaScript 函式內部宣告的變數（使用 var）是區域變數，所以只能在函式內部訪問它，（該變數的作用域是區域的），

全域 JavaScript 變數

在函式外宣告的變數是全域變數，網頁上的所有腳本和函式都能訪問它，

JavaScript 變數的生存期

JavaScript 變數的生命期從它們被宣告的時間開始，

區域變數會在函式運行以后被洗掉，

全域變數會在頁面關閉后被洗掉，

非嚴格模式下給未宣告變數賦值創建的全域變數，是全域物件的可配置屬性，可以洗掉，

var var1 = 1; // 不可配置全域屬性
var2 = 2; // 沒有使用 var 宣告，可配置全域屬性

console.log(this.var1); // 1
console.log(window.var1); // 1
console.log(window.var2); // 2

delete var1; // false 無法洗掉  區域變數無法被洗掉
console.log(var1); //1

delete var2;  //全域屬性可以被洗掉
console.log(delete var2); // true 已經洗掉
console.log(var2); // 已經洗掉 報錯變數未定義

JavaScript 作用域

在 JavaScript 中, 作用域為可訪問變數，物件，函式的集合

區域變數：只能在函式內部訪問， 函式引數只在函式內起作用，是區域變數，

全域變數有 全域作用域: 網頁中所有腳本和函式均可使用， 

在 HTML 中, 全域變數是 window 物件: 所有資料變數都屬于 window 物件，

如果變數在函式內沒有宣告（沒有使用 var 關鍵字），該變數為全域變數，

JavaScript 變數生命周期

JavaScript 變數生命周期在它宣告時初始化，

區域變數在函式執行完畢后銷毀，

全域變數在頁面關閉后銷毀，

你的全域變數，或者函式，可以覆寫 window 物件的變數或者函式，

區域變數，包括 window 物件可以覆寫全域變數和函式，

注：Window 物件表示瀏覽器中打開的視窗

常見的HTML事件的串列:

JavaScript 字串用于存盤和處理文本，

在JavaScript 中，字串寫在單引號或雙引號中;

下表中列舉了在字串中可以使用轉義字符轉義的特殊字符：

字串屬性和方法

屬性：        描述：

length　　 　　回傳字串的長度

prototype        允許您向物件添加屬性和方法

字串方法：

JavaScript運算子

運算子 = 用于給 JavaScript 變數賦值，

算術運算子 + 用于把值加起來，

y=5：

JavaScript 賦值運算子，

賦值運算子用于給 JavaScript 變數賦值，

給定 x=10 和 y=5，下面的表格解釋了賦值運算子：

用于字串的 + 運算子

+ 運算子用于把文本值或字串變數加起來（連接起來），

如需把兩個或多個字串變數連接起來，請用 + 運算子，

對字串和數字進行加法運算

兩個數字相加，回傳數字相加的和，如果數字與字串相加，回傳字串，

x,y, 和 z 輸出結果為:

JavaScript 比較 和 邏輯運算子

比較和邏輯運算子用于測驗 true 或者 false，

比較運算子

比較運算子在邏輯陳述句中使用，以測定變數或值是否相等，

<p給定x=5，下面的表格解釋了比較運算子：

如何使用

可以在條件陳述句中使用比較運算子對值進行比較，然后根據結果來采取行動：

邏輯運算子

邏輯運算子用于測定變數或值之間的邏輯，

給定 x=6 以及 y=3，下表解釋了邏輯運算子：

條件運算子

JavaScript 還包含了基于某些條件對變數進行賦值的條件運算子，

<p> 點擊按鈕判斷年齡，</p>
年齡:<input id="age" value="https://www.cnblogs.com/wdyjt/p/18"/>
<p>是否達到投票年齡？</p>
<button onclick="myFunction01()">點擊按鈕</button>
<p id="demo01"></p>
<script>
function myFunction01(){
	var age,voteable;
	age=document.getElementById("age").value;
	window.alert(voteable=(age<18)?"年齡不足":"年齡已達到");
	document.getElementById("demo01").innerHTML=voteable;
}
</script>

 JavaScript多元運算子

p>1?p<b?p>b:p=6:p=3

p>1? 整體 :p=3

1、當 p>1 時回傳 p<b?p>b:p=6

• 1.1、當 p<b 時回傳 p>b
•  1.2、當 p>=b 時回傳 p=6

2、當 p<=1 是回傳 p=3 所以先執行 1

3、實體中當 p＝9 的時候，回傳 p<b?p>b:p=6 接著執行 1.1，當 p＝9<12 時，回傳 p>b，即 9>12，條件不成立所以最終結果為 false，

JavaScript 中有三種邏輯運算子：

1. 取反 !

首先把資料轉化為布林值，然后取反，結果為 true 或 false，

<script type="text/javascript">
var a = [1,2,3];
var b = "hello";
var obj = new Object();
var d;

console.log(!"");   //true
console.log(!d);    //true
console.log(!a);    //false
console.log(!b);    //false
console.log(!obj);  //false
</script>

2. 邏輯與 &&

JavaScript 中邏輯與和其他語言不太一樣，如果第一個運算元是 true(或者能夠轉為 true)，計算結果就是第二個運算元，

如果第一個運算元是 false，結果就是 false（短路計算），對于一些特殊數值不遵循以上規則，

(個人理解為:如果運算的第一個運算元為true,則回傳第二個運算元,反之則回傳第一個運算元)

回傳的不是單純的 true 還是 false，而是具體的值；

若是第一個值轉換布林值為 true，就回傳第二個值；反之，回傳第一個值，

白話說就是：哪個值是錯的就回傳哪個值，如果都是對的，回傳最后一個值，

<script type="text/javascript">
var a = [1,2,3];
var b = "hello";
var obj = new Object();
var d;

console.log(true && 10);            //第一個運算元是true，結果是第二個操作，也就是10
console.log(false && b);            //第一個運算元是false，結果flase
console.log(100 && false);          //第一個運算元是100，結果flase
console.log(undefined && false);    //第一個運算元是undefined，結果undefined
console.log(NaN && false);          //第一個運算元是NaN，結果NaN
console.log(null && false);         //第一個運算元是null，結果null
console.log('' && false);           //第一個運算元是空串，結果空串
console.log(0 && 100);              //結果是0
console.log(5 && 100);              //100
console.log(a && b);                //hello
console.log(obj && 200);            //200
</script>

3. 邏輯或 ||

如果第一個運算元不是 false，結果就是第一個運算元，否則結果是第二個運算元，如果第一個運算元能夠轉為 true，

結果就是第一個運算元(個人理解為:如果運算的第一個運算元為 true,則回傳第一個運算元,反之則回傳第二個運算元)

同 && 類似，回傳的不是單純的 true 和 false，而是具體的值，

這個是從頭開始，遇到能轉換成 true 的值，就回傳那個值，如果沒有 true 的就回傳最后一個值，

<script type="text/javascript">
var a = [1,2,3];
var b = "hello";
var obj = new Object();
var d;

console.log(true || 10);        //第一個運算元是true，結果是第一個操作，也就是true
console.log(false || b);        //第一個運算元是false，結果是第二個運算元b
console.log(100 || false);      //第一個運算元是100，結果100
console.log(undefined || 9);    //第一個運算元是undefined轉false，結果9
console.log(NaN || false);      //第一個運算元是NaN轉false，結果第二個運算元
console.log(null || a);         //第一個運算元是null轉false，結果a
console.log('' || false);       //第一個運算元是空串轉false，結果第二運算元
console.log(0 || 100);          //結果是100
console.log(5 || 100);          //5
console.log(a || b);            //a
console.log(obj || 200);        //obj
</script>

作者：舊歌
鏈接：https://www.cnblogs.com/wdyjt/p/14125217.html
本文著作權歸作者和博客園共有，歡迎轉載，但未經作者同意必須在文章頁面給出原文連接，否則保留追究法律責任的權利

標籤：JavaScript

上一篇：移動端H5開發神器之vconsole

下一篇：第一章 代碼基本的格式化