JavaScript入門基礎
- 概述
- 變數的宣告
- 變數的作用域
- 基本資料型別
- Number型別
- String型別
- Boolean型別
- Undefined型別
- Null型別
- 三大參考型別
- Object型別
- Array型別
- Function型別
- typeof 運算子
- js撰寫的位置
- js的三種輸出方式
概述
JavaScript是世界上最流行的腳本語言，是一種運行在瀏覽器中的解釋型的編程語言，能夠實作跨平臺、跨瀏覽器，雖然只是十多天時間的產物，并且有很多的缺陷和陷阱，但也造就了JavaScript的靈活和強大，隨著Node.js的興起，JavaScript已經從單純實作前端互動，發展到可以全堆疊實作整個應用，尤其是在移動互聯網蓬勃發展以及應用追求極致用戶體驗的今天，JavaScript更是必須要重視和掌握的，
變數的宣告
使用var關鍵字進行變數的宣告，宣告的同時也可以進行賦值，變數的宣告只能有一次，但賦值可以有多次，如果只宣告變數，但是變數沒有被賦值，此時變數的值為undefined，
JavaScript變數的型別取決于右側的物件，
樣例代碼：
var variable_name1 = 5;
var variable_name2 = 5.3;
var variable_name3 = false;
var variable_name4 = 'zhangsan';
變數的作用域
JavaScript沒有塊級作用域
java：
if(true) {
int a = 1;
}
System.out.println(a); // 編譯錯誤，超出作用域
javascript：
if(true){
var a = 1;
}
console.log(a); // 輸出1 ，JavaScript沒有塊級作用域
基本資料型別
Number型別
Number型別包含整數和浮點數（浮點數數值必須包含一個小數點，且小數點后面至少有一位數字）兩種值，
String型別
單引號或雙引號擴起來的字符集合，
Boolean型別
該型別只有兩個值，true和false，
Undefined型別
只有一個值，即undefined值，使用var宣告了變數，但未給變數初始化值，那么這個變數的值就是undefined，
Null型別
Null型別被看做空物件指標，Null型別也是空的物件參考，
三大參考型別
Object型別
我們看到的大多數型別值都是Object型別的實體，創建Object實體的方式有兩種，
第一種是使用new運算子后跟Object建構式，如下所示
var person = new Object();
person.name = "Micheal";
person.age = 24;
第二種方式是使用物件字面量表示法，如下所示
var person = {
name : "Micheal",
age : 24
};
alert(person.name);
Array型別
陣列的每一項可以用來保存任何型別的資料，也就是說，可以用陣列的第一個位置來保存字串，第二個位置保存數值，第三個位置保存物件…另外，陣列的大小是可以動態調整的，
創建陣列的基本方式有兩種
第一種是使用Array建構式，如下所示
var colors = new Array("red","blue","yellow");
第二種是使用陣列字面量表示法，如下所示
var colors = ["red","blue","yellow"];
Function型別
每個函式都是Function型別的實體，而且都與其他參考型別一樣具有屬性和方法，函式通常是使用函式宣告語法定義的，如下所示
function sum(num1,num2){
return num1 + num2;
};
這和使用函式運算式定義函式的方式相差無幾，
var sum = function (num1,num2){
return num1 + num2;
};
var result = sum(5,8); alert(result);
typeof 運算子
由于js中的變數是弱型別的，所以它提供了一種檢測當前變數的資料型別的方法，也就是typeof關鍵字，
typeof 123 //Number
typeof 'abc' //String
typeof true //Boolean
typeof undefined //Undefined
typeof null //Object
typeof { } //Object
typeof [ ] //Object
js撰寫的位置
1.將JS代碼撰寫到script標簽中：
<script > 寫這里</script>
2.還可以將JS代碼撰寫到外部的js檔案中，然后通過script標簽來引入外部的檔案
3.可以將JS代碼撰寫到標簽的指定屬性中（不推薦使用）
樣例代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--可以將JS代碼撰寫到script標簽中-->
<!--<script type="text/javascript">
alert("hello");
</script>-->
<!--
還可以將JS代碼撰寫到外部的js檔案中，然后通過script標簽來引入外部的檔案
將JS代碼撰寫到外部檔案中，可以在不同的頁面中引入相同的JS代碼，
方便后期的維護，并且寫在外部檔案中可以使用瀏覽器的快取，加快訪問速度提高用戶體驗
如果使用script來引入外部檔案，則它就不能在撰寫任何的JS代碼了 ，
如果還需要撰寫則需要創建一個新的script標簽
-->
<script type="text/javascript" src="js/script.js"></script>
<script type="text/javascript">
alert("我是內部的JS代碼");
</script>
</head>
<body>
<!--
將JS代碼撰寫到標簽的屬性中，屬于結構與行為耦合，不方便后期的維護，不推薦使用
-->
<!--
可以將JS代碼撰寫到標簽的指定屬性中
-->
<button onclick="alert('點完的效果');">點這里</button>
<!--
可以將JS代碼撰寫到超鏈接的href中
-->
<a href="javascript:alert('第二個效果');">再點這里</a>
<br /><br />
</body>
</html>
效果動態圖：
js的三種輸出方式
/*
控制瀏覽器彈出一個提示框
*/
alert("Hello JavaScript");
/*
控制瀏覽器在頁面中輸出一個內容
document.write()向body中寫一個內容
*/
document.write("牛哄哄的柯南");
/*
向控制臺輸出一個內容
*/
console.log("Keafmd");
樣例代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
/*
控制瀏覽器彈出一個提示框
*/
alert("Hello JavaScript");
/*
控制瀏覽器在頁面中輸出一個內容
document.write()向body中寫一個內容
*/
document.write("牛哄哄的柯南");
/*
向控制臺輸出一個內容
*/
console.log("Keafmd");
</script>
</body>
</html>
效果截圖：
瀏覽器彈出一個提示框↓
瀏覽器在頁面中輸出一個內容↓
向控制臺輸出一個內容↓
控制臺調出步驟：網頁右鍵-檢查-選擇Console
寫作不易，如果看完對你有幫助，感謝點贊支持！
如果你是電腦端，看見右下角的“一鍵三連”了嗎，沒錯點它[哈哈]
加油！
共同努力！
Keafmd
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/206481.html
標籤：其他
上一篇：2020-11-06