JavaScript快速入門學習筆記

JavaScript簡述

HTML 可以爲網頁搭建結構並提供內容，CSS 可以爲網頁提供了樣式和排版。有了 HTML 和 CSS 這兩個標記型語言，一個完整的網頁可以製作完成並呈現到用戶瀏覽器上，那麼，爲什麼還需要學習 JavaScript 呢？相比 HTML/CSS，JavaScript 是一個真正意義上的 Web 前端語言，它是專門爲 Web 而生的面向對象的客戶端腳本語言。JavaScript語言可以直接嵌入網頁運行，實現動態特效、表單驗證、創建Cookies、修改 HTML 等一系列高級功能。按照 HTML/CSS/JavaScript 這三種技術在網頁中的功能，我們這樣總結它們各自的功能：HTML 實現網頁的結構層、CSS 實現網頁的表現層、JavaScript 實現網頁的行爲層。

JavaScript 只運行在 web 前端，是一種瀏覽器語言，在此基礎上拓展爲多種前端框架。

JavaScript組成

完整的 ECMAScript 標準並不僅僅是 JavaScript，還包括了 DOM 和 BOM。JavaScript 描述了該語言的語法和基本對象；DOM（文檔對象模型）描述了處理網頁內容的方法和接口；BOM（瀏覽器對象模型）描述了與瀏覽器進行交互的方法和接口。

JavaScript使用位置

JS 腳本可以放置在三個位置，包括 HTML 的 head 區域、HTML 的 body 區域、以及外部 JS 文件中。
當放置在 HTML 頁面中時，不管是head 還是 body 區域，都需要使用 <script></script> 標籤包含起來。

JS的每條語句之間用分號 ; 隔開，代碼塊用花括號 { } 括起來，代碼塊縮進爲4個空格。

JavaScript變量

變量可以是任意的數據類型，包括數字、字符串、數組、詞典等，變量（variable）是存儲信息的“容器”。通過變量可以實現複雜運算和高級編程。JS 的變量需要提前聲明，並且需要通過關鍵字 var 來實現（variable的縮寫），JS 是一種動態腳本語言，不需要制定變量的數據類型，聲明之後直接指定值即可。
JavaScript 解釋程序遇到未聲明過的標識符時，用該變量名創建一個全局變量，並將其初始化爲指定的值，這是該語言的便利之處（其實Python語言就無需聲明，直接採用上面的語法），不過如果不能緊密跟蹤變量，這樣做也很危險，最好的習慣是像使用其他程序設計語言一樣，總是聲明所有變量。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>變量</title>
</head>
<body>
<script>
    var a; // 變量申明，JS中沒有賦值的變量，默認值爲undefined
    var x = 1; // 變量申明並賦值
    var y = 2;
    var z = x + y;
    var name = "xiaoming"; // 變量相當於一個容器，可以映射不同數據類型的內容，包括數字、字符串、數組等
    var age = 18;
    var b = 2, c = 3, d = 4; // 一個JS語句多個變量賦值
    var f = function myFisrtFunction () {  // 變量也可以是一個函數
    }
    document.write(z + "<br>");
    document.write(name + ' is ' + age);
</script>
</body>
</html>

document.write();
console.log()；

二者的區別是 document.write() 是將值輸出到瀏覽器頁面；而 console.log() 是將值輸出到 console 日誌中。

ECMAScript 中有5種簡單數據類型(也稱爲基本數據類型)：Undeﬁned、Null、Boolean、Number和 String；
還有1種複雜數據類型：Object。
typeof(變量) 可以用於檢測變量的類型。

JavaScript數字

JavaScript數字（Number）對象只有一種數據類型，就是 Number 類型，不區分整數、浮點數等。數字對象可以支持十進制、八進制、十六進制、科學計數法等，可以實現的算術運算包括加法、減法、乘法、除法、求餘、累積、遞減等。另外，由於 JavaScript 類似 Java 和 Python 等面嚮對象語言，所以數字對象也具備屬性和方法。

關於 JS 數字的存儲方式和精確度，JavaScript 採用 IEEE754 標準定義的 64 位浮點格式表示數字，所有數字都存儲爲根爲 10 的 64 位（8 比特）的浮點數。因此，整數最多爲 15 位，小數的最大位數是 17，但是浮點運算並不總是 100% 準確。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript Number數字對象</title>
</head>
<body>
<script>
    //JS中數字不分爲整數、浮點數等區別，統一爲Number對象
    var a = 10; // 整數，最多爲15位
    var b = 3.14; // 浮點數
    var c = 123e5; // 科學計數法，12300000
    var d = 0.1 + 0.2; // 浮點數相加不精確，最大位數17位
    var e = 0123; // 八進制在數字前面加0
    var f = 0x1F; // 十六進制在數字前面加f

    // 算術運算
    var x = 1;
    var y = 2;
    var z1 = x + y; //加法運算
    var z2 = x - y; //減法運算
    var z3 = x * y; //乘法運算
    var z4 = x / y; //除法運算
    var z5 = x % y; //求餘運算
    var z6 = x ++; //累加運算
    var z7 = x --; //遞減運算

    // 算法方法
    var g = parseFloat("0.123abcdef");
    document.write(g+'<br>');

    var h = parseInt("100px");
    document.write(h+"<br>");

    // HTML輸出
    document.write(z1 + '<br>')
    document.write(z2 + '<br>')
    document.write(z3 + '<br>')
    document.write(z4 + '<br>')
    document.write(z5 + '<br>')
    document.write(z6 + '<br>')
    document.write(z7 + '<br>')
</script>
</body>
</html>

JavaScript字符串

JavaScript 字符串（String）對象用於處理字符串信息，字符串可以存儲一系列的字符信息，例如 hello,world ，與Python語言相同，JS的字符串採用單引號和雙引號括起來。字符串對象具備一系列屬性和方法，可以實現字符串相加、查詢、匹配、替代等處理。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript String字符串對象</title>
</head>
<body>
<script>
    // 字符串創建
    var s = 'Hello';
    var x = 'World!';
    var k = "what's your name?";

    // 字符串相連
    var y = s + x;

    // 字符串索引
    s[0];
    s[1];
    x[0];
    x[1];

    // 字符串長度
    var l1 = s.length;
    var l2 = x.length;

    // 字符串處理
    var a = y.toUpperCase(); //全部轉換爲大寫；
    var b = y.toLowerCase(); //全部轉換爲小寫；

    // 字符串搜索
    var c1 = y.indexOf('o'); // 返回搜索字符所在的下標位置
    var c2 = y.lastIndexOf('o'); // 返回搜索字符所在的下標位置

    // 字符串截取
    var d1 = y.substr(0, 3);  // 返回字符串區間內容
    var d2 = y.substring(0, 3);  // 返回字符串區間內容
    var d3 = y.slice(0, 3);  // 返回字符串區間內容

    // HTML輸出
    document.write(s+'<br>')
    document.write(x+'<br>')
    document.write(a+'<br>')
    document.write(b+'<br>')
    document.write(c1+'<br>')
    document.write(d1+'<br>')

    // 字符串應用（郵箱信息截取）
    function getMail(){
        var mail = prompt("登錄郵箱");  // 通過prompt方法獲取用戶輸入
        var pos = mail.indexOf("@");  // 獲取@字符的位置
        var name = mail.slice(0, pos);  // 獲取開頭到pos的字符
        var address = mail.substr(pos+1); // 獲取pos及之後的字符(含pos自身)，可以通過加1去除自身字符
        document.write("您輸入的用戶名是: "+name+"<br>");
        document.write("您輸入的郵箱域名是: "+address+"<br>");
    }
    getMail();  // 執行函數


    // 字符串應用（網址信息截取,獲取後綴名）
    var url = "http://www.baidu.com/index.html";

    function getFileFormat(url) {
        var pos = url.lastIndexOf(".");  // 獲取.的位置
        return url.substr(pos+1);  // 通過substr返回後綴名
    }

    var formatName = getFileFormat(url);  // 調用函數並賦值給變量formatName
    document.write("文件後綴爲: "+ formatName);  // 打印後綴名到html
</script>
</body>
</html>

JavaScript數組

JavaScript 數組（Array）對象可以存儲一系列信息的“容器”，包括數字、字符串、數組、布爾值等。與字符串類似，數組對象有一系列的屬性和方法，可以實現相加、索引、截取等操作。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript Array數組對象</title>
</head>
<body>
<script>
    // 創建數組
    var a = [1, 2, 3, 4, 5];  // 純數字的數組
    var b = [1, 'a', 2, 'b', 3, 'c'];  // 既有數字和字符串的數組
    var c = [10, 20, 'hello', 'arry', [1,2,3], true];  // 有數字、字符串、數組、布爾值的數組

    // 數組索引
    var d = a[0];
    var e = b[1];
    var f = c[4][0];

    // 數組長度
    var g = a.length

    // 數組截取
    a.slice(0,2);
    b.slice(1,3);

    // 數組相連
    var h = a.concat(b);

    // 數組搜索
    a.indexOf(5);
    a.lastIndexOf(5)
    c.indexOf('hello');

    // 數組賦值(修改）
    a[0] = 10;
    b[1] = 'hello';

    // HTML輸出
    document.write(a + '<br>')
    document.write(b + '<br>')
    document.write(c + '<br>')
    document.write(d + '<br>')
    document.write(e + '<br>')
    document.write(f + '<br>')
    document.write(g + '<br>')
    document.write(h + '<br>')
</script>
</body>
</html>

JavaScript字典

JavaScript 字典對象通過映射的方式實現一系列鍵值對的存儲。字典可以訪問、修改、判斷。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript對象(字典)</title>
</head>
<body>
<script>
    // 創建對象
    var dict =
        {
            a:1,
            b:2,
            c:'hello',
            d:'world',
        };
    // 訪問屬性
    var e = dict.a;
    var f = dict.b;

    // 修改屬性
    dict.c = 'hi';
    var g = dict.c;

    // 屬性判斷
    var h = 'a' in dict;
    var i = 'toString' in dict
    var j = dict.hasOwnProperty('toString')

    // HTML輸出
    document.write(e + '<br>')
    document.write(f + '<br>')
    document.write(g + '<br>')
    document.write(h + '<br>')
    document.write(i + '<br>')
    document.write(j + '<br>')
</script>
</body>
</html>

JavaScript流程控制之條件語句

JavaScript 流程控制語句（statement）包括 if、for 、while、switch、continue、break語句，通過這些語句，程序根據不同情況執行不同動作。
if 語句 - 只有當指定條件爲 true 時，使用該語句來執行代碼。
if…else 語句 - 當條件爲 true 時執行代碼，當條件爲 false 時執行其他代碼。
if…else if….else 語句 - 使用該語句來選擇多個代碼塊之一來執行。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>if條件語句</title>
</head>
<body>
<script>
    'use strict'
    // if(){}語句
    var a = -10;
    if (a > 5)
    {
        var b = 11
    }
    // if(){} else{}語句
    var c = 10;
    if (c < 0)
    {
        var d = 15
    }
    else
    {
        d = 20
    }
    // if(){} else if(){} else{}語句
    var e = 60;
    if (e > 90)
    {
        var f = 200;
    }
    else if(e > 80)
    {
        f = 150;
    }
    else
    {
        f = 0;
    }
    // HTML輸出
    document.write(b + '<br>')
    document.write(d + '<br>')
    document.write(f + '<br>')

    // 期末考試分數判斷
    var e = prompt("請輸入您的期末考試成績：");
    if (e > 80)
    {
        var f = "優秀，戒驕戒傲！";
    }
    else if(e > 70)
    {
        var f = "良好，再接再厲！";
    }
    else if(e > 60)
    {
        var f = "中等，仍需努力！";
    }
    else
    {
        var f = "學渣，回家種田！";
    }
    document.write(f);
</script>
</body>
</html>

switch 語句 - 使用該語句來選擇多個代碼塊之一來執行（一般當if判斷超過3個的時候使用此語句）。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Switch語句</title>
</head>
<body>
<script>
    var d = new Date().getDay();
    switch (d)
    {
        case 0:
            x = "星期日";
            break;
        case 1:
            x = "星期一";
            break;
        case 2:
            x = "星期二";
            break;
        case 3:
            x = "星期三";
            break;
        case 4:
            x = "星期四";
            break;
        case 5:
            x = "星期五";
            break;
        default: // 規定不匹配時，默認執行的語句
            x = "星期六";
    }
    document.write(x)
</script>
</body>
</html>

JavaScript流程控制之循環語句

若有重複的動作需要執行，則會採用循環語句。循環語句可以根據需求，執行一定次數的代碼塊。
JavaScript 支持以下循環語句：
for - 循環代碼塊一定的次數。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>for語句</title>
</head>
<body>
<script>
    // for語句（循環代碼塊一定的次數直到條件不滿足）
    var x = 0;
    var i;
    for (i=1; i<=100; i++) // 初始變量；循環條件；遞增條件（循環代碼塊被執行之後執行）
    {
        x = x + i;
    }
    document.write(x+'<br>');

    // for語句（遍歷數組）
    var arr = ['Apple', 'Google', 'Microsoft'];
    var n, y;
    for (n=0; n<arr.length; n++)
    {
        y = arr[n];
        document.write(y + '<br>');
    }

    //for語句（遍歷數組）
    cars = ["BMW", "Volvo", "Saab", "Ford"];
    var r=0;
    for (;cars[r];)
    {
        document.write(cars[r] + "<br>");
        r++;
    }
    // for_in語句（循環遍歷對象的屬性）
</script>
</body>
</html>

for/in - 循環遍歷對象的屬性。
while - 當指定的條件爲 true 時循環指定的代碼塊。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>While語句</title>
</head>
<body>
<script>
    var x=0, i=0;
    while (i < 5)
    {
        x = x + i;
        i++;
        document.write(x + "<br>");
    }
    // while循環讀取數組元素
    cars = ["BMW", "Volvo", "Saab", "Ford"];
    var n = 0;
    while (cars[n])
    {
        document.write(cars[n] + "<br>");
        n ++;
    }
</script>
</body>
</html>

do/while - do/while 循環是 while 循環的變體，該循環會執行一次代碼塊，在檢查條件是否爲真之前，如果條件爲真的話，就會重複這個循環。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>do_while語句</title>
</head>
<body>
<script>
    var x="", i=0;
    do
    {
        x = x + " The number is " + i + "<br>";
        i ++;
    }
    while (i < 5)
    document.write(x)
</script>
</body>
</html>

JavaScript流程控制之終止語句

很多時候，循環語句需要根據特定條件來終止循環，此時就需要用到循環語句，JavaScript 支持 break 和 continue 語句。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Break語句</title>
</head>
<body>
<script>
    var x = "", i = 0;
    for (i=0; i<10; i++)
    {
        if (i == 3)
        {
            break;
        }
        x = x + " The number is " + i + "<br>";
    }
    document.write(x)
</script>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Continue語句</title>
</head>
<body>
<script>
    var x = "", i = 0;
    for (i=0; i<10; i++)
    {
        if (i == 3)
        {
            continue;
        }
        x = x + " The number is " + i + "<br>";
    }
    document.write(x)
</script>
</body>
</html>

JavaScript函數

函數（Function）是封裝好的、可直接調用的、可重複使用的代碼塊，一般由變量、數據類型、表達式、流程控制等語句組成。函數是一種更高維度的編程方法，合理的創建和使用函數，可以讓代碼更加簡潔，也可以實現更復雜的功能。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>函數</title>
</head>
<body>
<script>

    // 不含參函數
    function abs() {
        var x = -1;
        if (x >= 0)
        {
            return x;
        }
        else
        {
            return -x;
        }
    }
    document.write(abs());

    // 含參函數
    function abs(x)
    {
        if (x >= 0)
        {
            return x;
        }
        else
        {
            return -x;
        }
    }
//    var a = abs(-10)
//    document.write(a)

    // 獲取用戶輸入再取絕對值
    var a = prompt("輸入一個數字:")
    var b = abs(a)
    document.write(b)

</script>
</body>
</html>

JavaScript快速入門學習筆記

JavaScript快速入門學習筆記

JavaScript簡述

JavaScript組成

JavaScript使用位置

JavaScript變量

JavaScript數字

JavaScript字符串

JavaScript數組

JavaScript字典

JavaScript流程控制之條件語句

JavaScript流程控制之循環語句

JavaScript流程控制之終止語句

JavaScript函數

androguard解析指令及字節碼

python理解類和麪向對象

使用androguard生成方法控制流圖CFG

IOTFUZZER: Discovering Memory Corruptions in IoT Through App-based Fuzzing

python函數與模塊

Mac下配置sublime實現LaTeX

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結