JavaScript物件（二）

阿新 • • 發佈：2021-11-08

陣列物件

用於儲存一組有序的任意型別的物件

陣列物件是一系列有序的值的集合，可以存放任何型別的資料，建議只存放一種型別資料

方法：

陣列的使用

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
    <head>
        <title></title>
        <script type="text/javascript">
            var arr0 = new Array();
             
var arr1 = new Array(3);
            var arr2 = new Array("謝燦軟體", "www.xiecan.cc");
            var arr3 = ["謝燦軟體", "www.xiecan.cc"];

            arr0[0] = "謝燦軟體";
            arr0[1] = "www.xiecan.cc";

            document.write(arr0.length + "<br>"); //輸出2
            document.write(arr0 + "<br> 
"); //輸出"謝燦軟體,www.xiecan.cc"
            arr0.length = 0;
            document.write(arr0.length + "<br>"); //輸出0
            document.write(arr0 + "<br>"); //

            arr0[0] = "謝燦軟體";
            arr0[1] = "www.xiecan.cc";
            for (var i = 0; i < arr0.length; i++)
            {
                document.write( 
"arr0["+ i + "] = "+ arr0[i]);
            }

            document.write("<br>");
            for (var i in arr0)
            {
                document.write("arr0[" + Number(i) + "] = " + arr0[i]);
            }
        </script>
    </head>
    
    <body>
    
    </body>
</html>

陣列物件

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
    <head>
        <title></title>
        <script type="text/javascript">
            var arr1 = new Array("謝燦軟體", "www.xiecan.cc");
            var arr2 = ["謝燦軟體", "www.xiecan.cc"];

            document.write(arr1.concat(arr2) + "<br>");

            document.write(arr1.join("-") + "<br>"); 
            
            arr1.pop();
            document.write(arr1 + "<br>");
            arr1.shift();
            document.write(arr1 + "<br>");

            arr1.push(20);
            document.write(arr1 + "<br>");
            arr1.unshift("測試");
            document.write(arr1 + "<br>");

            arr1.reverse();
            document.write(arr1 + "<br>");

            document.write(arr1.slice(1) + "<br>"); 

            arr1.sort();
            document.write(arr1 + "<br>");

            //1 開始位置
            //2 刪除數量
            //3 替換新值
            arr1.splice(0, 1);
            document.write(arr1 + "<br>");
            arr1.splice(0, 0, "測試1");
            document.write(arr1 + "<br>");
        </script>
    </head>
    
    <body>
    
    </body>
</html>

動態切換

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html lang="zh-cn">
    <head>
        <title></title>
        <style type="text/css">
            body
            {
                text-align:center;
            }
        </style>

        <script type="text/javascript">
            window.onload = function () {
                var img = document.getElementById("img");
                var arr = ["Img/img1.jpg", "Img/img2.jpg",
                "Img/img3.jpg", "Img/img4.jpg"];

                var num = 1;
                setInterval(function () {
                    num++;
                    if (num == arr.length)
                        num = 0;
                    img.src = arr[num];
                }, 1000);
            }
        </script>
    </head>
    
    <body>
        <img id="img" alt="" src="Img/img1.jpg" />
    </body>
</html>

js不支援多維陣列但是可以用：

多維陣列

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        var citys = new Array();
        citys["河南"] = ["鄭州", "開封", "焦作", "商丘"]
        citys[1] = ["武漢", "天門", "黃石", "赤壁"]
        for (var i in citys) {
            document.write(citys[i] + "<br>");
            for (var j = 0; j < citys[i].length; j++) {
                document.write((citys[i][j]) + "<br>");
            }
        }
    </script>
</head>
<body>
</body>
</html>

正則表示式物件

主要用於驗證表單資訊

正則表示式主要用於表單驗證，如手機號、郵箱、身份證等

在使用正則表示式之前，首先要建立正則表示式物件。JavaScript提供了兩種構建方法：

使用正則標識字串

var reg = /pattern/[flags]

使用內建正則表示式物件

var reg = new RegExp("pattern",["flags"])
pattern表示要使用的正則表示式模式，也就是由的特殊字元或普通字元所組成的表示式。 flags標誌位，可選項，有g（全文查詢）、i（忽略大小寫）、m（多行查詢）三種。

compile()方法。把正則表示式編譯為內部格式，從而執行更快使用新正則去替換舊正則，主要用於提升比較複雜和耗時的處理過程的效能，一般情況下很少使用。
exec()方法。用正則表示式在字串中查詢，並返回包含結果的一個數組。不僅用於判斷給定的字串是否匹配，而且會返回匹配結果的詳細資訊。
test()方法。返回一個bool值，它指出被查詢的字串是否匹配給定的模式。使用頻繁，主要用於匹配測試。匹配成功返回true，否則返回false。

正則表示式方法

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
    <head>
        <title></title>        <style type="text/css">
           body
           {
               text-align:center;
           }
           #Text1
           {
               color:Red;
               font-size:20px;
               text-align:left;
               white-space: normal;
               height: 30px;
               width: 400px;
           }
        </style>
        <script type="text/javascript">
            window.onload = function () {

                document.getElementById("btnYX1").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
                    alert(reg.test(txt));
                }

                document.getElementById("btnDH1").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /^\d{3,4}-(\d{7,8})$/;
                    alert(reg.test(txt));
                }

                document.getElementById("btnSZ1").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /^[0-9]+([.][0-9]+){0,1}$/;
                    alert(reg.test(txt));
                }

                document.getElementById("btnZW1").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /^[\u4e00-\u9fa5]+$/;
                    alert(reg.test(txt));
                }

                document.getElementById("btnYW1").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /^[a-zA-Z]+$/;
                    alert(reg.test(txt));
                }

                document.getElementById("btnIP1").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /^(((\d{1,2})|(1\d{2})|(2[0-4]\d)|(25[0-5]))\.){3}((\d{1,2})|(1\d{2})|(2[0-4]\d)|(25[0-5]))$/;
                    alert(reg.test(txt));
                }

                document.getElementById("btnKB1").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /^\n\s*\r$/;
                    alert(reg.test(txt));
                }

                document.getElementById("btnYX2").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/;
                    alert(reg.exec(txt));
                }

                document.getElementById("btnDH2").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /\d{3,4}-(\d{7,8})/;
                    alert(reg.exec(txt));
                }

                document.getElementById("btnSZ2").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /[0-9]+([.][0-9]+){0,1}/;
                    alert(reg.exec(txt));
                }

                document.getElementById("btnZW2").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /[\u4e00-\u9fa5]+/;
                    alert(reg.exec(txt));
                }

                document.getElementById("btnYW2").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /[a-zA-Z]+/;
                    alert(reg.exec(txt));
                }

                document.getElementById("btnIP2").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /(((\d{1,2})|(1\d{2})|(2[0-4]\d)|(25[0-5]))\.){3}((\d{1,2})|(1\d{2})|(2[0-4]\d)|(25[0-5]))/;
                    alert(reg.exec(txt));
                }

                document.getElementById("btnKB2").onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    var reg = /\n\s*\r/;
                    alert(reg.exec(txt));
                }
            }
        </script>
    </head>
    <body>
        <input id="Text1" type="text" value="[email protected]" />
        <div>
            <input id="btnYX1" type="button" value="郵箱1" />
            <input id="btnDH1" type="button" value="電話1" />
            <input id="btnSZ1" type="button" value="數字1" />
            <input id="btnZW1" type="button" value="中文1" />
            <input id="btnYW1" type="button" value="英文1" />
            <input id="btnIP1" type="button" value="I  P1" />
            <input id="btnKB1" type="button" value="空行1" />
        </div>
        <div>
            <input id="btnYX2" type="button" value="郵箱2" />
            <input id="btnDH2" type="button" value="電話2" />
            <input id="btnSZ2" type="button" value="數字2" />
            <input id="btnZW2" type="button" value="中文2" />
            <input id="btnYW2" type="button" value="英文2" />
            <input id="btnIP2" type="button" value="I  P2" />
            <input id="btnKB2" type="button" value="空行2" />
        </div>
    </body>
</html>

驗證電話號碼：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
    <head>
        <title></title>
        <script type="text/javascript">
//            function isPhoneNumber(phone) {
//                //11位和12位電話號碼
//                if (phone.length == 12 || phone.length == 13) {
//                    for (var i = 0; i < phone.length; i++) {
//                        //檢查連線符是否正確
//                        if (phone.charAt(4) != "-")
//                            return false;
//                        //檢查是否全部為數字
//                        else if (phone.charAt(i) < 0 || phone.charAt(i) > 9) {
//                            return false;
//                        }
//                    }
//                    return true;
//                }
            //            }
            function isPhoneNumber(phone) {
                var reg = /^\d{4}[-]\d{7,8}$/;
                return reg.test(phone);
            }
        </script>
    </head>
    <body onload="alert(isPhoneNumber('0370-1234567'));">
    </body>
</html>

驗證中文字元：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
    <head>
        <title></title>
        <style type="text/css">
           body
           {
               text-align:center;
           }
           #Text1
           {
               color:Red;
               font-size:20px;
               text-align:left;
               white-space:pre-wrap;
                height: 277px;
                width: 318px;
           }
        </style>
        <script type="text/javascript">
            window.onload = function () {
                var test = document.getElementById("TEST");
                var exec = document.getElementById("EXEC");
                var reg = /^[\u4e00-\u9fa5]+$/;//{2,4}
                test.onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    alert(reg.test(txt));
                }
                exec.onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    alert(reg.exec(txt));
                }
            }
        </script>
    </head>
    <body>
        <input id="Text1" type="text" value="謝燦軟體 www.xiecan.cc" />
        <br>
        <input id="TEST" type="button" value="TEST" />
        <input id="EXEC" type="button" value="EXEC" />
    </body>
</html>

驗證電子郵箱：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
    <head>
        <title></title>
        <style type="text/css">
           body
           {
               text-align:center;
           }
           #Text1
           {
               color:Red;
               font-size:20px;
               text-align:left;
               white-space: normal;
               height: 31px;
               width: 400px;
           }
        </style>
        <script type="text/javascript">
            window.onload = function () {
                var test = document.getElementById("TEST");
                var exec = document.getElementById("EXEC");
                var reg = /^\w+@\w+[.]\w+[.]?\w+$/;  //. 匹配出\n  \d數值  \D非數值
                test.onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    alert(reg.test(txt));
                }
                exec.onclick = function () {
                    var txt = document.getElementById("Text1").value;
                    alert(reg.exec(txt));
                }
            }
        </script>
    </head>
    <body>
        <input id="Text1" type="text" value="[email protected]" />
        <br/>
        <input id="TEST" type="button" value="TEST" />
        <input id="EXEC" type="button" value="EXEC" />
    </body>
</html>

驗證表單：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
    <head>
        <title></title>
<!--        <script type="text/javascript">
            window.onload = function () {
                var reg1 = /^\d{3,4}[-]\d{7,8}$/;
                //返回true
                alert(reg1.test('0370-1234567'));
                //返回0370-1234567
                alert(reg1.exec('電話號碼：0370-1234567'));
            }
        </script>-->

        <script type="text/javascript">

            function btnonclick() {
                var txtName = document.getElementById("Text1");
                var strName = txtName.value;
                var regName = /^[\u4e00-\u9fa5]+$/;
                if (!regName.test(strName)) {
                    alert("帳號含有非中文字元");
                }

                var txtPwd = document.getElementById("Text2");
                var strPwd = txtPwd.value;
                var regPwd = /^[0-9a-zA-Z_]{8,}$/;
                if (!regPwd.test(strPwd)) {
                    alert("密碼必須是字母、數字或下劃線，且不能低於8位");
                }

                var txtEml = document.getElementById("Text3");
                var strEml = txtEml.value;
                var regEml = /^[0-9a-zA-Z_.]+@[0-9a-zA-Z_]+[.][0-9a-zA-Z_]+$/;
                if (!regEml.test(strEml)) {
                    alert("非法的郵箱格式");
                }
            }

        </script>

    </head>
    <body>
    
        <p>
            帳號：<input id="Text1" type="text" />必須是中文</p>
        <p>
            密碼：<input id="Text2" type="text" />必須是字母、數字或下劃線，不能低於8位</p>
        <p>
            郵箱：<input id="Text3" type="text" /></p>
        <p>
            <input id="Button1" type="button" value="取消" />
            <input id="Button2" type="button" value="確定" onclick="return btnonclick()" /></p>
    
    </body>
</html>

正則表示式與字串

match() 使用正則表示式模式對字串執行查詢，並將結果作為陣列返回。
replace() 返回根據正則表示式進行文字替換後的字串。
search() 返回與正則表示式查詢內容匹配的第一個子字串的位置，不支援全域性搜尋。
split() 使用正則表示式模式對字串進行切割，並將結果作為陣列返回。

正則表示式與字串方法：

去除首尾空格：

鏈式程式設計

JSON物件

JavaScript物件（二）

陣列物件用於儲存一組有序的任意型別的物件陣列物件是一系列有序的值的集合，可以存放任何型別的資料，建議只存放一種型別資料

JavaScript Blob二進位制檔案物件（二）使用示例

JavaScript Blob二進位制檔案物件（二）使用示例 1.Blob 建構函式用法舉例 Blob() 建構函式允許通過其它物件建立 Blob 物件。比如，用字串構建一個 blob：

php面試題之面向物件（二）

繼上一篇“php面試題之面向物件（一）”發表後，今天繼續更新。整個面向物件文章的結構涉及的內容模組有：

第七章、面向物件（二）

第七章面向物件今日內容 1.JVM記憶體 2.構造方法和方法過載 3.this關鍵字 4.方法的傳參

javascript學習（二）--函式

一、在JavaScript中，定義函式的方式如下： 1、第一種方式： function abs(x) { if (x >= 0) {

面向物件（二）

1.類中的構造器初始化物件的過程： 1)JVM會檢查類是否被載入，如果沒有，則載入類的位元組碼到方法區(有且載入一次)；

vue + arcgis for javascript 實戰（二）實現底圖切換，經緯度顯示等

技術標籤：arcgisvuegisvuejsarcgis 好了，我們繼續給我們的地圖進行配置現在path:src/utils資料夾加入一個EsriConfig.js檔案,我們將option和Modules移入進入然後匯出。

python 面向物件（二）

技術標籤：Python 一、類中定義成員方法 """ 格式一: class 類名: def 方法名(self):

2021年02月08日除錯筆記Java類和物件（二）

技術標籤：Java程式設計java面向物件程式設計注意：這個為小白程式設計除錯記錄，裡面有些程式碼不是正確的，僅僅是個記錄！！！！！

回撥地獄與Promise物件（二）

promise // promise物件 // resolve可以將非同步資料傳遞出來 let p = new Promise(function(resolve){

面向過程 & 面向物件（二）

面向過程 & 面向物件 package com.oop;import com.oop.demo03.Pet;//一個專案應該只存在一個main方法public class Application {public static void main(String[] args) {/*1.類與物件類是一個模板：抽象