JavaScript学习笔记(二)

demo2.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>


    <script>
        function p(s){
            document.write(s);
            document.write("<br>");
        }
        p("1 + 2 = " + (1 + 2));
        p("10 - 7 = " + (10 - 7));
        p("5 * 4 = " + (5 * 4));
        p("20 / 4 = " + (20 / 4));
        p("10 % 3 = " + (10 % 3));
    </script>

    <script>
        var a = 5;
        document.write(a++);
        document.write("<br>")
        var b = 5;
        document.write(++b);
        document.write("<br>");
    </script>

    <script>
        x = 5;
        x += 6;
        document.write(x);
        document.write("<br>")
    </script>

<!--    + 具备多态特征-->
<!--    当两边都是数字的时候 ,表现为算数运算符-->
<!--    当任意一边是字符串的时候,表现为字符串连接符-->
    <script>
        document.write("1 + 2 = " + (1 + 2));
        document.write("<br>");
        document.write("1 + \" 2 \" = " + (1 + "2"));
        document.write("<br>")
    </script>

<!--    逻辑运算符 : ==    !=    >    >=       返回一个Boolean类型的值,true或者false-->
    <script>
        function p(s) {
            document.write(s);
            document.write("<br>")
        }
        p(1 == 2);
        p(1 != 2);
        p(1 > 2);
    </script>

<!--==进行值是否相等的判断不同 ,绝对等 ===还会进行 类型的判断-->
<!--    比如 数字1和 字符串'1'比较,值是相等的,但是类型不同-->
<!--    所以==会返回true,但是===会返回false-->
<!--    绝对不等于!== 与上是一个道理-->
    <script>
        function p(s){
            document.write(s);
            document.write("<br>");
        }
        p(1 == "1");
        p(1 === "1");
    </script>

<!--    三目运算符 ?: 有三个操作数-->
<!--    如果第一个返回true,就返回第二个操作符-->
<!--    否则就返回第三个操作符。-->
    <script>
        var x = 15;
        var y = x == 10?"你好":"你不好";
        document.write(y + "<br>")
    </script>

    <script>
        var age = 17;
        if(age < 18){
            document.write("未成年!");
        }else if(age < 20){
            document.write("成年!");
        }else{
            document.write("赶紧结婚!")
        }
    </script>

    <script>
        var day = new Date().getDay();  //通过日期对象获取数字形式的星期几
        var today;
        switch (day) {
            case 0:
                today = "星期日";
                break;
            case 1:
                today = "星期一";
                break;
            case 2:
                today = "星期二";
                break;
            case 3:
                today = "星期三";
                break;
            case 4:
                today = "星期四";
                break;
            case 5:
                today = "星期五";
                break;
            case 6:
                today = "星期六";
                break;

        }
        document.write("今天是:" + today);
        document.write("<br>")
    </script>

    <script>
        function p(s) {
            document.write(s);
            document.write("<br>");
        }
        for(var i = 0;i < 5;i++){
            p(i);
        }

        var j = 0;
        while(j < 5){
            p(j);
            j++;
        }

        var k = 0;
        do{
            p(k);
            k++;
        }while(k < 5);

        function f(s) {
            document.write(s);
            document.write("<br>");
        }
        var x = new Array(3,1,4);
        for(i = 0;i < x.length;i++){
            f(x[i]);
        }
        // 使用增强for in循环遍历
        // 在增强for in中,i是下标的意思
        for(i in x){
            f(x[i]);
        }

    </script>

<!--    错误处理-->
    <script>
        function f1(){

        }
        try{
            document.write("调用不存在的f2<br>");
            f2();
        }catch (err) {
            document.write("捕捉到错误产生!<br>");
            document.write(err.message + "<br>");
        }
        document.write("错误被捕捉,后续代码可以继续执行!<br>");
    </script>

<!--    通过new Number()创建一个数字对象  对象类型的数字,拥有更多的属性和方法-->
    <script>
        var x = new Number(123);
        document.write(x + "<br>");
        document.write(typeof x + "<br>");
        // Number对象能取到的最大和最小值
        document.write(Number.MIN_VALUE + "<br>");
        document.write(Number.MAX_VALUE + "<br>");
        document.write(isNaN(x) + "<br>");
        document.write(x.toFixed(2) + "<br>");  //保留两位小数
        document.write(x.toExponential() + "<br>");  //返回Number对象的科学计数法表达
        document.write(x.valueOf() + "<br>");   //返回一个基本类型的数字
    </script>

    //new String创建一个字符串对象
    <script>
        var x = "5";
        var y = new String(x);
        document.write(y + "<br>");
        document.write(typeof y + "<br>");
        var z = new String("Hello Java<br>");
        document.write(z.length + "<br>");
        // charAt 返回指定位置的字符
        // charCodeAt 返回指定位置的字符对应的Unicode码
        document.write(z.charAt(0) + "<br>");
        document.write(z.charCodeAt(0) + "<br>");
        document.write(y.concat(z) + "<br>");  //concat字符串拼接
        document.write(z.indexOf("a") + "<br>");   //字符第一次出现的位置
        document.write(z.lastIndexOf("a") + "<br>");  //字符最后一次出现的地方
        var a = "hello";
        var b = "world";
        document.write(a.localeCompare(b) + "<br>");  //localeCompare 比较两段字符串是否相同,0即表示相同,非0表示不同
        document.write(z.substring(0,3) + "<br>");  //substring 截取一段子字符串  左闭右开

        var c = new String("Hello this is JavaScript");
        var d = c.split(" ");   //split 根据分隔符,把字符串转换为数组。
        document.write(d + "<br>");
        var e = c.split(" ",2);  //只保留前两个
        document.write(e + "<br>");

        //replace(search,replacement)
        // 找到满足条件的子字符串search,替换为replacement
        // 默认情况下只替换找到的第一个子字符串,如果要所有都替换,需要写成:regs
        document.write(z.replace("a","o") + "<br>");
        var regS = new RegExp("a","g");
        var f = z.replace(regS,"o");
        document.write(f + "<br>");

        //所有返回字符串类型的方法,返回的都是基本类型的String
    </script>


<!--    javascript中的数组是动态的,即长度是可以发生变化的-->
<!--    创建数组对象的3种方式:-->
<!--    1. new Array() 创建长度是0的数组-->
<!--    2. new Array(5); 创建长度是5的数组,,但是其每一个元素都是undefine-->
<!--    3. new Array(3,1,4,1,5,9,2,6); 根据参数创建数组-->
    <script>
        function p(s,v) {
            document.write(s + " " + v);
            document.write("<br>");
        }
        var x = new Array();
        p("通过new Array()创建一个空数组:",x);
        x = new Array(5);
        p("创建一个长度是5的数组:",x);
        x = new Array(12,2,3,4,5,6);
        p("创建有初值的数组:",x);
        p("数组长度:",x.length);
        // 遍历数组的两种方式
        // 1.结合for循环,通过下标遍历
        // 2.使用增强for in循环遍历,在增强for in中,i是下标的意思
        for(i = 0;i < x.length;i++){
            p("数组中第" + (i+1) + "位:",x[i]);
        }
        for(i in x){
            p("数组中第" + x[i] + "位:",x[i]);
        }

        //concat连接两个数组
        y = new Array(9,8,7,6,5);
        z = x.concat(y);
        p("两个数组连接:",z)

        //方法join通过指定分隔符,返回一个数组的字符串表达
        var a = z.join();
        p("通过join返回的数组的字符串表达:",a);
        var b = z.join("@");
        p("通过指定分隔符@返回的字符串表达:",b);

        //方法 push pop,分别在最后的位置插入数据和获取数据(获取后删除)
        z.push(5);
        p("向数组中push元素5得到数组:",z);
        var c = z.pop();
        p("pop获取数组的最后一个元素:",c);
        p("pop后的数组是:",z);

        //方法 unshift shift ,分别在最开始的位置插入数据和获取数据(获取后删除)
        z.unshift("a");
        p("数组在最开始的位置插入元素a之后:",z);
        var d = z.shift();
        p("获取的最开始位置的元素为:",d);
        p("shift之后的数组为:",z);

        //方法 sort对数组的内容进行排序
        z.sort();   //默认排序按首位字符排序
        p("排序之后的数组为:",z);

        //sort()默认采用正排序,即小的数排在前面。 如果需要采用自定义排序的算法,就把比较器函数作为参数传递给sort()
        //调用sort函数的时候,把这个比较器函数comparator作为参数传递进去即可。
        function comparator(v1,v2) {
            return v2-v1;   //v2-v1表示大的放在前面
        }
        function comparator1(v1,v2){
            return v1-v2;
        }
        z.sort(comparator1);
        p("使用自定义的排序1之后的数组:",z);
        z.sort(comparator)
        p("使用自定义的排序之后的数组:",z);

        //消除数组的重复元素然后排序
        function check(value,s) {
            for(i in a){
                if(value == s[i])
                    return true;
                //return false;
            }
            return false;
        }
        function removeDuplicate(s) {
            var result = new Array();
            while(s.length != 0){
                var v = s.pop();
                if(!check(v,s)){
                    result.push(v);
                }
            }
            return result;
        }
        p("数组在:",z);
        z = removeDuplicate(z);
        z.sort(comparator1);
        p("消除重复元素后的数组z排序:",z);


        //方法 reverse,对数组的内容进行反转
        z.reverse();
        p("数组z反转后为:",z);

        //方法 slice 获取子数组
        p("获取子数组:",z.slice(1));
        p("获取子数组:",z.slice(1,4));  //左闭右开


        // 方法 splice用于删除数组中的元素,它还能用于向数组中插入元素
        p("数组z:",z);
        z.splice(3,2);
        p("从位置3开始删除两个元素:",z);
        z.splice(3,2,1,5);
        p("从位置3开始删除两个元素,但是插入1和5:",z);
    </script>

</head>
<body>

</body>
</html>
发布了10 篇原创文章 · 获赞 1 · 访问量 5653
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章