JavaScript复习:二

JavaScript复习

  • 二十、DO WHILE循环
  • 二十一、 FOR循环
    • <1>.for案例
  • 二十二、BREAK终止循环
  • 二十三、CONTINUE结束本次循环
  • 二十四、函数的概念
  • 二十五、函数的参数
  • 二十六、返回值
  • 二十七、预解析
    • <1>.解释代码
  • 二十八、作用域
    • <1>.全局作用域
    • <2>.局部作用域
  • 二十九、变量使用规则
    • <1>.访问规则
    • <2>.赋值规则
  • 三十、13.对象
  • 三十一、对象的遍历
  • 三十二、存储
  • 三十三、数组
  • 三十四、数组的基本操作
  • 三十五、冒泡排序法
  • 三十六、选择排序法

二十、DO WHILE循环

是一个和while循环类似的循环
while会先进行条件判断,满足就执行,不满足直接就不执行了
但是do while循环是,先不管条件,先执行一回, 然后在开始进行条件判断
语法: do {要执行的代码} while (条件)
        do{
            var res = prompt("请输入你的名字:");
            if(res){
                document.write(res)
            }
        }while(!res)

二十一、 FOR循环

和while和do while循环都不太一样的一种循环结构
道理是和其他两种一样的,都是循环执行代码的
语法:for(vari=0;i<10;i++){要执行的代码}
       for(var n=1;n<=10;n++){
        console.log(n);
       }

<1>.for案例

    <style>
        span{
            display: inline-block;
            width: 100px;
        }
    </style>
</head>
<body>
    <script>
        // var sum = 0;
        // for(var i = 1;i<=100;i++){
        //      sum = sum + i;
        // }
        // document.write(sum);
        // var count = 0;
        // for(var i = 1000;i<=2000;i+=4){
        //     if(i%400==0 || i%100 !==0){
        //         document.write(i + " ");
        //     }
        //     count++;
        //     if(count%4==0){
        //         document.write("
");
// } // } for(var m=1;m<=9;m++){ for(var n=1;n<=m;n++){ document.write(""+m+"*"+n+"="+m*n+" "+""); } document.write("
"
); } </script>

二十二、BREAK终止循环

在循环没有进行定比的时候,因为我设置的条件满足,提前终止循环
比如:我要吃五个包子,吃到三个的时候,不能在吃了,我就停止吃包子这个事情
要终止循环,就可以直接使用break关键字

二十三、CONTINUE结束本次循环

在循环中,把循环的本次跳过去,继续执行后续的循环
比如:吃五个包子,到第三个的时候,第三个掉地下了,不吃了,跳过第三个,继续吃第四个和第五个
跳过本次循环,就可以使用continue关键字

二十四、函数的概念

对于js来说,函数就是把任意一段代码放在一个盒子里面
在我想要让这段代码执行的时候,直接执行这个盒子里面的代码就行
先看一段代码
        // 1.定义函数
        // (1)声明式
        function text1(){
            document.write("你好,");
        }

        // (2).赋值式
        var text2 = function(){
            document.write("世界!");
        }


        // 2.调用函数
        text1();
        text2();

二十五、函数的参数

我们在定义函数和调用函数的时候都出现过()
现在我们就来说一下这个()的作用
就是用来放参数的位置
参数分为两种行参和实参
        var text = function(a,b) {
            var drink = a == 1?"可乐":"雪碧";
            var eat   = b == 1?"薯条":"炸鸡";
            document.write("我是套餐A:"," " + drink," " + eat);
        }
        text(1,2);

二十六、返回值

函数调用本身也是一个表达式,表达式就应该有一个值出现
现在的函数执行完毕之后,是不会有结果出现的
return 关键字就是可以绘函数执行完毕一个结果
我们可以在函数内部使用return关键把任何内容当作这个函数运行后的结果
        var isPrime = function(n){
            // var n = 71;
            for(var i = 2; i <= n/2; i++){
                if(n%i == 0){
                    break
                }
                // console.log(i)
            }
            if(i <= n/2){
                // console.log("不是");
                return false;
            }else{
                // console.log("是");
                return true;
            }
        }
        var res = isPrime(77);
        console.log(res);

        for(var i=300;i<500;i++){
            if(isPrime(i)){
                console.log(i)
            }
        }

二十七、预解析

预解析其实就是聊聊js代码的编译和执行
js是一个解释型语言,就是在代码执行之前,先对代码进行通读和解释,然后在执行代码
也就是说,我们的js代码在运行的时候,会经历两个环节 解释代码 和 执行代码

<1>.解释代码

因为是在所有代码执行之前进行解释,所以叫做预解析(预解释)
需要解释的内容有两个:
1.声明式函数
在内存中先声明有一个变量名是函数名,并且这个名字代表的内容是一个函数
2.var关键字
在内存中先声明有一个变量名

二十八、作用域

什么是作用域,就是一个变量可以生效的范围
变量不是在所有地方都可以使用的,而这个变量的使用范围就是作用域

<1>.全局作用域

全局作用域是最大的作用域
在全局作用域中定义的变量可以在任何地方使用
页面打开的时候,浏览器会自动给我们生成一一个全局作用域wi ndow
这个作用域会一直存在,直到页面关闭就销毁了

<2>.局部作用域

局部作用域就是在全局作用域下面有开辟出来的一一个相对小- -些的作用域
在局部作用域中定义的变量只能在这个局部作用域内部使用
在JS中只有函数能生成一个局部作用域,别的都不行
每一个函数,都是一个局部作用域

二十九、变量使用规则

有了作用域以后,变量就有了使用范围,也就有了使用规则
变量使用规则分为两种 访问规则 和 赋值规则

<1>.访问规则

当我想获取一个变量的值的时候,我们管这个行为叫做访问
获取变量的规则:
首先,在自己的作用域内部查找,如果有,就直接拿来使用
如果没有,就去上一级作用域查找,如果有,就拿来使用|
如果没有,就继续去上一 级作用域查找,依次类推
如果一直到全局作用域都没有这个变量,那么就会直接报错(该变量is not defined)
PS: 变量的访问规则也叫做作用域的查找机制
作用域的查找机制只能是向上找,不能向下找

<2>.赋值规则

当你想给一个变量赋值的时候,那么就先要找到这个变量,在给他赋值
变量赋值规则:
先在自己作用域内部查找,有就直接赋值
没有就去上一级作用域内部查找,有就直接赋值
还没有再去上一级作用域查找,有就直接赋值
如果一直找到全局作用域都没有,那么就把这个变量定义为全局变量, 再给他赋

三十、13.对象

对象是一个复杂数据类型
其实说是复杂,但是没有很复杂,只不过是存储了一些基本数据类型的一个集合
例如 var obj={
        num: 100,
        str: 'he11o world',
        boo: true
        }
这里的{}和函数中的{}]不一样
函数里面的是写代码的,而对象里面是写一些数据的
对象就是一个键值对的集合
{}里面的每一个键都是一个成员
也就是说,我们可以把一些数据放在一个对象里面,那么他们就互不干扰了
其实就是我们准备一个房子,把我们想要的数据放进去,然后把房子的地址给到变量名,
当我们需要某个数据的时候,就可以根据变量名里面存储的地址找到对应的房子,
然后去房子里面找到对应的数据
        var obj = {
            name : "OverWatch",
            age: 6,
        }
        console.log(obj);

        // 内置构造函数
        var obj1 = new Object()
        obj1.name = "world"
        obj1.age = 100000;1
        console.log(obj1);

        // 查
        document.write("姓名是" + obj1.name);

        // 改
        obj1.age = 200000;
        console.log(obj1);

        // 删
        delete obj1.name
        console.log(obj1);

        // 2-增
        var obj2 = {}
        obj2["name"] = "你好";
        console.log(obj2);

        // 2-查
        console.log(obj2["name"]);

        // 2-改
        obj2["name"] = "不好";
        
        // 2-删
        delete obj2["name"];

三十一、对象的遍历

        var obj = {
            name: "小明",
            age : 18
        }
        for(var i in obj){
            document.write(obj[i]);
            document.write("
"
); }

三十二、存储

         var obj = {
            name: "小明",
            age : 18
        }
        console.log(obj);
        var obj2 = {};
        for(var i in obj){
            obj2[i] = obj[i];
        }
        obj2["name"] = "小红";
        console.log(obj2);

三十三、数组

什么是数组?
字面理解就是数字的组合
其实不太准确,准确的来说数组是一个数据的集合
也就是我们把一些数据放在一个盒子里面,按照顺序排好
[1,2,3,'he11o', true, false]
这个东西就是一个数组,存储着一些数据的集合
数据类型分类
number/ string 1 boolean / undefined / nu11 / object / function / array / ...
数组也是数据类型中的一种
我们简单的把所有数据类型分为两个大类基本数据类型和复杂数据类型
基本数据类型: number / string / boolean / undefined / nu11
复杂数据类型: object / function 1 array 1..
        // 字面量

        var ageArr =[12,13,14,15,16]
        var nameArr = ["小米","小明","小红"];
        var studentArr = [{
            name: " 小米",
            age: 100
        },{
            name: " 小明",
            age: 100 
        }
        ]
        console.log(ageArr)
        
        // Array

        var arr1 = new Array(12,13,14)
        
        console.log(arr1)

三十四、数组的基本操作

        var arr1 = [1,2,3,4,5]
        arr1.length = 3;
        console.log(arr1.length);

        // 清空数组
        arr1.length = 0

        // 索引 0,1,2,3
        var arr2 = ["小米","小明","小红"];
        arr2[0] = "华为"; 
        arr2[3] = "Apple";
        console.log(arr2[0],arr2[2],arr2[1],arr2[3])

        // 遍历
        var arr3 =[3,4,5,6,7,8]
        for(var i=0; i<arr3.length;i++){
            console.log(arr3[i]);
        }
        var arr4=[];
        for(var i=0; i<arr3.length;i++){
            arr4[n] = arr3[n]
        } 

三十五、冒泡排序法

先遍历数组,让挨着的两个进行比较,如果前一个比后一个大, 那么就把两个换个位置
数组遍历一遍以后,那么最后一个数字就是最大的那个了
然后进行第二遍的遍历,还是按照之前的规则,第二大的数字就会跑到倒数第二的位置
以此类推,最后就会按照顺序把数组排好了
        // var arr = [4,3]
        // var temp = arr[0]
        // arr[0] = arr[1]
        // arr[1] = temp
        // console.log(arr);

        var arr = [4,3,9,1,5,2,8,7]

        // for(var n=0;n
        //     for(var i=0;i
        //     if(arr[i]>arr[i+1]){
        //         var temp = arr[i]
        //         arr[i] = arr[i+1]
        //         arr[i+1] = temp
        //     }
        // } 
        // }

        for(var n = 0;n<arr.length-1;n++){
            for(var m = 0;m<arr.length-1-n;m++){
                if(arr[m]>arr[m+1]){
                    var temp = arr[m]
                    arr[m] = arr[m+1]
                    arr[m+1] = temp
                }
            }
        }

        console.log(arr);

三十六、选择排序法

先假定数组中的第0个就是最小的数字的索引
然后遍历数组,只要有一个数字比我小,那么就替换之前记录的索引
知道数组遍历结束后,就能找到最小的那个索引,然后让最小的索弓|换到第0个的位置
再来第二趟遍历,假定第1个是最小的数字的索引
在遍历一次数组,找到比我小的那个数字的索引
遍历结束后换个位置
         var arr = [234,12,5445,6,5,4,2,1]
         for(var m = 0;m<arr.length-1;m++){
            var minIndex = m
            for(var i = m+1;i<arr.length;i++){
                if(arr[i]<arr[minIndex]){
                    minIndex = i
                }
            }
            var temp = arr[m]
                arr[m] = arr[minIndex]
                arr[minIndex] = temp
         }
         console.log(arr);

你可能感兴趣的:(javascript,前端,html)