什么是JavaScript?
JavaScript(簡稱“JS”) 是一種具有函式優先的輕量級,解釋型或即時編譯型的編程語言,雖然它是作為開發Web頁面的腳本語言而出名,但是它也被用到了很多非瀏覽器環境中,JavaScript 基于原型編程、多范式的動態腳本語言,并且支持面向物件、命令式、宣告式、函式式編程范式,
JavaScript在1995年由Netscape公司的Brendan Eich,在網景導航者瀏覽器上首次設計實作而成,因為Netscape與Sun合作,Netscape管理層希望它外觀看起來像Java,因此取名為JavaScript,但實際上它的語法風格與Self及Scheme較為接近,
JavaScript的標準是ECMAScript ,截至 2012 年,所有瀏覽器都完整的支持ECMAScript 5.1,舊版本的瀏覽器至少支持ECMAScript 3 標準,2015年6月17日,ECMA國際組織發布了ECMAScript的第六版,該版本正式名稱為 ECMAScript 2015,但通常被稱為ECMAScript 6 或者ES2015,
JavaScript的組成結構,
JavaScript是由:ECMASCRIPT,BOM,DOM所組成,
ECMASCRIPT: 定義了javascript的語法規范,描述了語言的基本語法和資料型別,簡單說ECMASCRIPT是一種語言標準,而JavaScript是網景公司對ECMASCRIPT標準的一種實作, BOM (Browser Object Model): 瀏覽器物件模型有一套成熟的可以操作瀏覽器的 API,通過 BOM 可以操作瀏覽器,比如: 彈出框、瀏覽器跳轉、獲取解析度等, DOM (Document Object Model): 檔案物件模型有一套成熟的可以操作頁面元素的 API,通過 DOM 可以操作頁面中的元素,比如: 增加個 div,減少個 div,給div 換個位置等,
總的來說: JavaScript就是通過固定的語法去操作 瀏覽器 與 標簽結構 來實作網頁上的各種效果,
JS(JavaScript的簡稱)的書寫位置:
與css樣式一樣,js也分為:行內式,內嵌式,外鏈式,
行內式js代碼使用方法: 需要依靠事件(行為)來觸發
第一種方法:
<div onclick="alert('彈話框')">點一下</div>
//寫在元素上可以用事件來觸發,onclick就是一個滑鼠點擊事件,后面跟著的alert就是js代碼,表示彈出對話框里面內容為"彈話框",總的意思就是點擊“點一下”這個div盒子會彈出一個彈話框上面寫著"彈話框"
第二種方法:
<a href="javascript:alert('彈話框');">點一下</a>
//寫在a標簽中可以用href后直接跟:javascript:(js代碼),因為a標簽可以進行點擊跳轉,所以在其中加入js代碼也可以執行,上述代碼的意思就是點擊a的超鏈接彈出一個彈話框上面寫著"彈話框"
內嵌式js代碼使用方法:會在打開頁面的時候直接觸發
<script type=text/javascript>
js代碼
</script>
//寫在HTML中,用script標簽包裹,宣告內部為js代碼,可以書寫在body里面或者head里面
外鏈式js代碼使用方法:需要在外部新建一個js檔案然后引入了 html 頁面,就會在頁面打開的時候直接觸發
<script src="檔案名.js">
js代碼
<script>
//在HTML中用src跟js檔案路徑匯入就可以使用外部的js方法
JS變數
什么是變數:變數是指程式中保存資料的一個容器也是計算機記憶體中存盤資料的識別符號,根據變數名稱可以獲取到記憶體中存盤的資料,簡單來說:我們存盤了一個東西放進記憶體中,需要給這個記憶體定義一個名稱,這次才能方便我們找尋到它,
語法為:var 變數名 = 變數值
var a; //定義一個變數a
a = 1; //給變數a賦值為1
//上面兩行代碼可以縮寫為,意思相同
var a = 1; //定義一個變數的同時賦值給它
注意:一個變數名只能存盤一個值,當再次給一個同名的變數賦值的時候,前面一次的值就被覆寫了,變數名稱區分大小寫(JS 區分大小寫),
變數命名規則:
一個變數名稱可以由 數字、字母、英文下劃線(_)、美元符號($) 組成
輸入內容嚴格區分大小寫
不能由數字開頭,不要使用中文漢字命名
不能是 保留字 或者 關鍵字
不要出現空格
JS資料型別
JS的資料型別通常分為兩大類:基礎資料型別與復雜資料型別
//共有五大基礎型別
//第一種:數值型別(number)
1,2,3,4,5....一切數字都為數值型別(包括進制)以及NaN(not a number)
//第二種:字串型別(string)
"1",'1'...都是字串型別,一切被引號所包裹的內容都是字串型別
//第三種:布爾型別(Boolean)
只有兩個值,true或者false
//第四種:null型別(null)
只有一個值,表示為空的
//第五種:undefined型別(undefined)
只有一個值,表示沒有值的意思
**注意null的值==undefined的值,但他們的資料型別是不相等的
//復雜資料型別有很多種在這里我就舉例一下
//函式資料型別(funciton)
語法為:
funciton 變數名(行參){
js執行代碼
}
//定義完一個函式型別的時候想要拿出來用就需要呼叫:變數名(實參)
既然資料型別大概了解了一下,那么怎么判斷資料型別呢? 這里可以用到:typeof,來判斷,
// 第一種使用方式
var n1 = 100; //定義一個變數n1里面傳遞一個引數為100
console.log(typeof n1); //在控制臺列印出來(點擊F12會彈出控制臺),會顯示內容為:number
// 第二種使用方式
var s1 = 'abcdefg'; //定義一個字串型別的變數
console.log(typeof(s1)); //列印會顯示內容為:string
當然如果想判斷一個變數是否是純數字的話,可以使用另一個方法:isNaN(is not a number),
// 如果變數是一個數字
var n1 = 100;
console.log(isNaN(n1)); //會列印false
// 如果變數不是一個數字
var s1 = 'Jack'
console.log(isNaN(s1)); //會列印true
那么資料型別是否之間可以轉換呢?答案當然是可以的,
資料型別轉換
//資料轉換為number型別
第一種:Number(變數)//把變數強制轉化為數值型別,會保留小數,當遇到不可以轉換的回傳NaN
例如:number("100")
第二種:parseInt(變數) //把變數強制轉換為數值型別,從第一位開始檢查時是數字就回傳,直到找到一個非數字就停止,會取整數,如果開頭不是數字就回傳NaN
例如:parseInt("123asd"),就會回傳123數值
第三種:parseFloat(變數) //把變數強制轉換為數值型別,從第一位開始檢查時是數字就回傳,直到找到一個非數字就停止,會保留一位小數,如果開頭不是數字就回傳NaN
例如:parseFloat("12.34"),就會回傳12.34數值
第四種:除加法以外的數字運算,減,乘,除,//運算子兩邊都是可運算元字才行,如果運算子任何一遍不是一個可運算元字,那么就會回傳 NaN
例如:"3" - 1 = a,那么a的值就會為2數值,因為"3"被減號轉換為數值3了所以才可以進行運算
//資料轉換為字串型別
第一種:變數.toString(),有一些資料型別不能使用 toString() 方法,比如 undefined 和 null
例如:console.log(123.toString()),結果會在控制臺輸出"123"
第二種:String(變數),所有資料型別都可以轉換為字串
例如:console.log(String(132)),結果會在控制臺輸出"123"
第三種:使用加法運算,進行字串拼接
例如:'1'+2,結果就會為一個字串"12"
//其他資料轉換成Boolean
在js中,只有 ''、0、null、undefined、NaN,這些是 false,其余都是 true
js里面也有加減乘除嗎?看看有什么區別,順便也了解一下其他運算子,
數學運算子
+(加法)
只有符號兩邊都是數字的時候才會進行加法運算
只要符號任意一邊是字串型別,就會進行字串拼接
-(減法)
會執行減法運算
會自動把兩邊都轉換成數字進行運算
*(乘法)
會執行乘法運算
會自動把兩邊都轉換成數字進行運算
/(除法)
會執行除法運算
會自動把兩邊都轉換成數字進行運算
%(取余)
會執行取余運算
會自動把兩邊都轉換成數字進行運算
賦值運算子
=(注意:在js里面等于號不是等于的意思而是把等號后面的值賦給等號前面)
例如:var num = 100 //就是把 100 賦值給 num 變數,那么 num 變數的值就是 100
+=
例如: var a = 10;a += 10; console.log(a); //結果為20
a += 10 等價于 a = a + 10 //相當于把a原本是值重新覆寫為a+10
-=
例如:var a = 10;a -= 10;console.log(a); //結果為0
a -= 10 等價于 a = a - 10
*=
例如:var a = 10;a *= 10;console.log(a); //結果為100
a *= 10 等價于 a = a * 10
/+
例如:var a = 10;a /= 10;console.log(a); //結果1
a /= 10 等價于 a = a / 10
%=
例如:var a = 10;a %= 10;console.log(a); //結果0
a %= 10 等價于 a = a % 10
比較運算子
==
比較符號兩邊的值是否相等,不管資料型別
例如:1 == '1'
兩個的值是一樣的,所以得到 true
===
比較符號兩邊的值和資料型別是否都相等
例如:1 === '1'
兩個值雖然一樣,但是因為資料型別不一樣,所以得到 false
!=
比較符號兩邊的值是否不等
例如:1 != '1'
因為兩邊的值是相等的,所以比較他們不等的時候得到 false
!==
比較符號兩邊的資料型別和值是否不等
例如:1 !== '1'
因為兩邊的資料型別確實不一樣,所以得到 true
>=
比較左邊的值是否 大于或等于 右邊的值
例如:1 >= 1 //true
例如:1 >= 0 //true
例如:1 >= 2 //false
<=
比較左邊的值是否 小于或等于 右邊的值
例如:1 <= 2 //true
例如:1 <= 1 //true
例如:1 <= 0 //false
>
比較左邊的值是否 大于 右邊的值
例如:1 > 0 //true
<
比較左邊的值是否 小于 右邊的值
例如:1 < 2 //true
邏輯運算子
&&(進行“且”的運算)
符號左邊必須為true 并且右邊也是true,才會回傳true,只要有一邊不是true,那么就會回傳false
例如:true && true //結果true
例如:true && false //false
例如:false && true //false
例如:false && false //false
||(進行“或”的運算)
符號的左邊為true 或者右邊為true,都會回傳true,只有兩邊都是false 的時候才會回傳false
例如:true || true //true
例如:true || false //true
例如:false || true //true
例如:false || false //false
!(進行“取反”運算)
本身是 true 的,會變成 false,本身是 false 的,會變成 true
例如:!true //false
例如:!false //true
一元運算子(自增自減運算子)
++(進行自增運算)
分成兩種,前置++ 和 后置++
第一種:前置++,會先把值自動 +1,再回傳
例如:var a = 10;console.log(++a); // 會回傳 11,并且把 a 的值變成 11
第二種:后置++,會先把值回傳,再自動+1
例如:var a = 10;console.log(a++); // 會回傳 10,然后把 a 的值變成 11
--(進行自減運算)
分成兩種,前置-- 和 后置--,和 ++ 運算子道理一樣
第一種:前置--,會先把值自動 -1,再回傳
第二種:后置--,會先把值回傳,再自動-1
運算子優先級從高到低
1 () 優先級最高 2 一元(單目)運算子:++,--,! 3 算術運算子: 先*,/,% 再+,- 4 關系運算子:>,>=,<,<= 5 相等運算子:==,===,!=,!== 6 邏輯運算子:先&&,再|| 7 賦值運算子 口訣:單目算術位關系,邏輯三目后賦值
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/292509.html
標籤:其他
上一篇:Ansible-list-Dictionary-資料格式
下一篇:jquery簡單學習
