初識JavaScript的基礎

Posted on by

一、JavaScript的書寫位置

一般分為三種：行內、內嵌、和外

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 2.內嵌式的js -->
    <script>
        alert('彈出')
    </script>
    <!-- 3.外部的js -->
    <script src="outside.js"></script>
</head>
<body>
    <!-- 1.行內式的js,直接寫在元素內部 -->
    <input type="button" value="button" onclick="alert('我是一個按鍵')">
</body>
</html>

二、JavaScript常用的輸入輸出語句

1.瀏覽器彈出警告框：

alert（msg）

2.瀏覽器控制臺打印輸出信息：

console.log(msg)

輸出信息在F12中的console可以看到

3.瀏覽器彈出輸入框，讓用戶可以輸入：

prompt（info）

三、變量

1.變量的使用：

1.聲明變量 2.賦值

js的數據變量類型在程序運行時根據等號右邊的值來進行確認

         var a；//聲明變量a
         a=1；
         alert（a）

2.讀取輸入的值(cin>>)

 <script>
        var a = prompt();
        // a=1;
        alert(a); 
    </script>

3.JavaScript中數值的最大最小值、無窮

Number.MAX_VALUE Number.MIN_VALUE

Infinity -Infinity

4.使用isNaN來判斷是否為數字

isNaN(11) 返回false 不是數字返回true

5.typeof檢測變量數據類型

<script>
    var num =10;
    console.log(typeof num);//檢測num的數據類型
</script>

6.數據類型轉換

6.1轉換為字符串

//1. toString()
var num=1;
alert(num.toString());
//2.String()強制轉換
var num = 1;
alert(String(num));
//3.加號拼接字符串
var num = 1;
alert(num+"字符串");

6.2轉化成數字型

    <script>
        // 1.parseInt 得到的是整數
        var age = prompt("input your age");
        console.log(parseInt(age))
        // 2.parseFloat 得到的是浮點數
        console.log(parseFloat(age));
        // 3.Number()強制轉換
        console.log(Number(age));
        // 4.利用算數運算 - * /都可以
        console.log('12'-0);
        console.log('12'-'10')//輸出為數字型的2
    </script>

6.3轉化為佈爾型

使用Boolean()函數

代表空、否定的值會被轉換為 false ，如〝O、NaN、 null、undefined

其餘值都會被轉換為 true

四、運算符

運算符優先級

五、函數

1.函數的使用：先聲明函數，再調用函數

function 函數名(){
        //函數體
}

2.函數的參數

分為形參和實參

3.函數的返回值

用return return 返回的值

return後面的代碼不會被執行且隻能返回一個值

4.argument的使用

當我們不確定有多少個參數傳遞的時候，可以用arguments來獲取。在JavaScript中，arguments 實際上它是當前函數的一個內置對象。所有函數都內置瞭一個arguments 對象，arguments 對象中存儲瞭傳遞的所有實參

function fn(){
    console.log(argument);//裡面存儲瞭所有傳遞過來的實參
    }
fn(1,2,3);

瀏覽器中

argument展示形式是一個偽數組，但是他具有數組的length的屬性並且按照索引的方式存儲。可是他沒有數組的一些方法 如：pop push

5.函數的兩種聲明方法

1.命名函數

 function fn(){
    //函數體
    }
    fn();

2.匿名函數

var fun = function(){
    //函數體
}
fun();

fun是變量名 不是函數名但函數表達式（匿名函數）也可以進行參數的傳遞

六、作用域

1.JavaScript的作用域

通常來說 ，一段程序代碼中所用到的名字並不總是有效和可用的，而限定這個名字的可用性的代碼范圍就是這個名字的作用域。作用域的使用提高瞭程序邏程的局部性，增強瞭程序的可靠性，減少瞭名字沖突。

一般分為全局作用域和局部作用域

全局作用域是在整個script標簽中的，局部作用域是在函數內部

值得註意的是，在js中是沒有塊級作用域的，即如果在if中聲明一個變量，在外面也是可以調用的

if(3>5){
    var num = 1;
}
console.log(num);

在瀏覽器中是可以進行編譯不會報錯的

2.變量的作用域

全局變量也是在script標簽中的，如果在函數內部沒有聲明直接賦值的變量也屬於全局變量

function fn(){
    num2 =10;//全局變量
    var num1 =1;//局部變量
    }

全局變量在函數中也可以使用

3.作用域鏈

根據在內部函數可以訪問外部函數變量的這種機制，用鏈式查找決定哪些數據能被內部函數訪問

采用就近原則。

總結

本篇文章就到這裡瞭，希望能夠給你帶來幫助，也希望您能夠多多關註WalkonNet的更多內容！

推薦閱讀：