JavaWeb9.2【JS:ECMAScript基本对象】

image

1. Function:函数(方法)对象

  1. 创建:
    1. var fun = new Function(形式参数列表,方法体); //不推荐
    2. function 方法名称(形式参数列表){
      方法体
      }
    3. var 方法名 = function(形式参数列表){
      方法体
      }
  2. 属性:
    length:代表形参的个数
  3. 特点:
    1. 方法定义是,形参的类型不用写,返回值类型也不写
    2. 方法是一个对象,如果定义名称相同的方法,会覆盖
    3. 在JS中,方法的调用只与方法的名称有关,和参数列表无关
    4. 在方法声明中有一个隐藏的内置对象(数组),arguments,封装所有的实际参数
  4. 调用:
    方法名称(实际参数列表);
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script>
        //创建方式1(不推荐)
        var fun1 = new Function("a", "b", "c", "alert(a)");
        //fun1(3, 4);

        //创建方式2
        function fun2(a, b) { //注意形参列表里不需要写var,且返回值类型也不用写
            alert(a + b);
        }
        //fun2(3, 4);

        //创建方式3
        var fun3 = function (a, b) {
            alert(a - b);
        }; //注意这种创建方式末尾带分号
        //fun3(3, 4);

        //方法名.length属性,返回形参列表长度,即形参个数
        // alert(fun1.length); //3
        // alert(fun2.length); //2
        // alert(fun3.length); //2

        // 方法是一个对象,如果定义名称相同的方法,会覆盖
        fun2 = function (a, b) { //方法覆盖
            alert(a - b);
        };
        //fun2(3, 4);

        //在JS中,方法的调用只与方法的名称有关,和参数列表无关
        fun2 = function(a, b){
            alert(a);
            alert(b);
        };
        // fun2(1,2); //1 2
        // fun2(1);  //1 undefined
        // fun2();  //undefined undefined
        // fun2(1, 2, 3);  //1 2    3不被弹出(其实他也被接收了,见下面详解)

        /*function add(a, b) { //求两数和
            return a+b;
        }
        var sum = add(1, 2);
        alert(sum); //3*/
        // 在方法声明中有一个隐藏的内置对象(数组),arguments,封装所有的实际参数
        /*function test() {
            alert(arguments[0]);
            alert(arguments[1]);
        }
        test(1,2);*/
        function add() { //求任意个数的和
            var sum = 0;
            for (var i=0; i<arguments.length; i++){
                sum += arguments[i];
            }
            return sum
        }
        alert(add());
        alert(add(1,2,3));
        alert(add(1,2,3,4,5));

    </script>
</head>
<body>

</body>
</html>

2. Array:数组对象

  1. 创建:
    1. var arr = new Array(元素列表);
    2. var arr = new Array(默认长度);
    3. var arr = [元素列表];
  2. 方法
    join(参数):将数组中的元素按照指定的分隔符拼接为字符串
    push() 向数组的末尾添加一个或更多元素,并返回新的长度。
  3. 属性
    length:数组的长度
  4. 特点:
    1. JS中,数组元素的类型可变的。
    2. JS中,数组长度可变的。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>

    <script>
        //创建方式
        var arr1 = new Array(1, 2, 3);
        var arr2 = new Array(5); //指定长度的空数组
        var arr3 = [1, 2, 3, 4];
        /*document.write(arr1+"<br>");
        document.write(arr2+"<br>");
        document.write(arr3+"<br>");*/
        /*
        1,2,3
        ,,,,
        1,2,3,4
        */
        var arr4 = [1, "abc", 'cde', true];
        document.write(arr4[0] + "<br>");
        document.write(arr4[1] + "<br>");
        document.write(arr4[2] + "<br>");
        document.write(arr4[3] + "<br>");
        arr4[10] = "hehe"; //不会像java一样会报数组下标越界错误,js的数组是类型可变、长度可变的
        document.write(arr4[10] + "<br>"); //hehe
        document.write(arr4[8] + "<br>"); //undefined
        document.write("arr4-length:" + arr4.length + "<br>"); //11

        //join()  push()
        document.write(arr4.join() + "<br>"); //1,abc,cde,true,,,,,,,hehe    默认用","分割数组并拼成字符串
        document.write(arr4.join("#") + "<br>"); //1#abc#cde#true#######hehe
        arr4.push(11);
        document.write(arr4.join("#") + "<br>"); //1#abc#cde#true#######hehe#11

    </script>
<body>

</body>
</html>

image

3. Boolean

4. Number

5. String

6. Date:日期对象

  1. 创建:
    var date = new Date();
  2. 方法:
    toLocaleString():返回当前date对象对应的时间本地字符串格式
    getTime():获取毫秒值。返回当前日期对象描述的时间到1970年1月1日零点的毫秒值差

7. Math:数学对象

  1. 创建:
    特点:Math对象不用创建,直接使用。 Math.方法名();
  2. 方法:
    random():返回 0 ~ 1 之间的随机数。 含0不含1
    ceil(x):对数进行上舍入。
    floor(x):对数进行下舍入。
    round(x):把数四舍五入为最接近的整数。
  3. 属性:
    PI
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script>
        var date = new Date();
        document.write(date + "<br>"); //Sun Jun 27 2021 15:21:00 GMT+0800 (中国标准时间)
        document.write(date.toLocaleDateString() + "<br>");  //2021/6/27
        document.write(date.toLocaleString() + "<br>");  //2021/6/27下午3:23:05
        document.write(date.getTime() + "<br>"); //1624778638124   返回当前日期对象描述的时间到1970年1月1日零点的毫秒值差

        document.write(Math.PI + "<br>"); //3.141592653589793
        document.write(Math.random() + "<br>"); //[0,1)间的随机数
        document.write(Math.round(3.6) + "<br>"); //4 四舍五入
        document.write(Math.ceil(3.6) + "<br>"); //4 向上取整
        document.write(Math.floor(3.6) + "<br>"); //3 向下取整
        /**
         * 取 1~100之间的随机整数
         *      1. Math.random()产生随机数:范围 [0,1)小数
         *      2. 乘以 100 --> [0,99.9999] 小数
         *      3. 舍弃小数部分 :floor --> [0,99] 整数
         *      4. +1 -->[0,99] 整数 [1,100]
         */
        var num = Math.floor(Math.random() * 100) + 1;
        document.write(num + "<br>");

    </script>
</head>
<body>

</body>
</html>

image

8. RegExp:正则表达式对象

  1. 正则表达式:定义字符串的组成规则。
    1. 单个字符:[]
      如: [a] [ab] [a-zA-Z0-9_]
      • 特殊符号代表特殊含义的单个字符:
        • \d:单个数字字符 [0-9]
        • \w:单个单词字符[a-zA-Z0-9_]
    2. 量词符号:
      • ?:表示出现0次或1次
      • *:表示出现0次或多次
      • +:出现1次或多次
      • {m,n}:表示 m<= 数量 <= n
        • m如果缺省: {,n}:最多n次
        • n如果缺省:{m,} 最少m次
    3. 开始结束符号
      • ^:开始
      • $:结束
  2. 正则对象:
    1. 创建
      1. var reg = new RegExp("正则表达式"); (注意字符串中要是用转义字符\,即“\”表示"")
      2. var reg = /正则表达式/;
    2. 方法
      1. test(参数):验证指定的字符串是否符合正则定义的规范

9. Global

  1. 特点:全局对象,这个Global中封装的方法不需要对象就可以直接调用。方法名();
  2. 方法:
    • encodeURI():url编码
    • decodeURI():url解码
    • encodeURIComponent():url编码,编码的字符更多
    • decodeURIComponent():url解码
    • parseInt():将字符串转为数字
      • 逐一判断每一个字符是否是数字,直到不是数字为止,将前边数字部分转为number
    • isNaN():判断一个值是否是NaN
      • NaN六亲不认,连自己都不认。NaN参与的==比较全部为false
    • eval(): 将JavaScript字符串转为脚本代码来执行
  3. URL编码
    传智播客 = %E4%BC%A0%E6%99%BA%E6%92%AD%E5%AE%A2
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script>
        //RegExp:正则表达式对象
        var reg = new RegExp("^\\w{6,12}$"); //字符串中"\\"表示\,第一个为转义字符
        var reg2 = /^\w{6,12}$/; //^和$表示开头和结尾
        // \w{6,12}表示:单个字符组成、长度6-12

        var username = "zhangsan";
        var flag = reg2.test(username);
        // alert(flag); //true
        var password = "123";
        var flag2 = reg.test(password);
        // alert(flag2); //false



        //Global:全局对象
        var str = "传智播客";

        var encoder = encodeURI(str);
        document.write(encoder + "<br>"); //%E4%BC%A0%E6%99%BA%E6%92%AD%E5%AE%A2
        var decoder = decodeURI(encoder);
        document.write(decoder + "<br>"); //传智播客

        var encoder1 = encodeURIComponent(str);
        document.write(encoder1 + "<br>"); //%E4%BC%A0%E6%99%BA%E6%92%AD%E5%AE%A2
        var decoder1 = decodeURIComponent(encoder);
        document.write(decoder1 + "<br>"); //传智播客

        var str_num = "123";
        var num = parseInt(str_num);
        // alert(num + 1); //124
        str_num = "456abc";
        var num = parseInt(str_num);
        // alert(num + 1); //457
        str_num = "a789abc";
        var num = parseInt(str_num);
        // alert(num + 1); //NaN

        var a = NaN;
        document.write(a == NaN); //false
        document.write(isNaN(a)); //true

        var jscode = "alert(123);";
        eval(jscode); //弹123
    </script>
</head>
<body>

</body>
</html>

image

posted @ 2021-06-27 13:54  yub4by  阅读(31)  评论(0编辑  收藏  举报