0
点赞
收藏
分享

微信扫一扫

网页前端第六次2.12

i奇异 2022-02-12 阅读 35

一.数组
            数组的定义
                1.隐式定义
                    var数组名=[];1/空数组var数组名=[值1,值2,值3...];
                2.直接实例化
                    var数组名= new Array(值1,值2,值3... );
                3.定义数组并设置长度
                    var数组名= new Array ( size);
                    
            数组的操作
                数组的下标从0开始(不会出现下标越界)
                获取数组指定下标的值: (如果下标不存在,则undefined)
                    数组名[下标];
                设置数组指定下标的值:  (如果下标不存在,则自动扩容)
                    数组名[下标]=值;
                获取数组的长度
                    数组名.length;
                设置数组的长度:
                    数组名.length  = 值
                了解
                    如果设置非整数型的下标,则会成为数组的属性,不计入数组的长度
                    设置属性:
                        数组名.属性名=值;
                        数组名["属性名"]=值;
                    获取属性:
                        数组名.属性名;
                        数组名["属性名"】;

            数组的遍历
                1. for循环遍历
                    for (var index = 0; index<数组长度; index++ ){
                        
                    }
                    相当于Java中:
                    for(int index = e; index<数组长度; index++){
                2. for . . .in循环
                    for(var下标名 in 数组){
                        
                    }
                3. forEach循环
                    数组.forEach(function(element , index){
                    // element:元素
                    // - index:下标
                   });
                
                注:
                    for --》 不遍历属性
                    foreach --》不遍历属性和索引中的undefined
                    for- in --》·不遍历索引中的undefined

            数组提供的方法:
                push          添加元素到最后
                index0f       数组元素索引
                join          数组转成字符串
                split         字符串方法:将字符串转换成数组
                unshift       添加元素到最前
                pop           删除最后一项
                shift         删除第一项
                reverse       数组翻转
                slice         截取(切片)数组,原数组不发生变化
                splice        剪接数组,原数组变化,可以实现前后删除效果
                concat        数组合并

 <script type="text/javascript">
         /*数组的定义*/
         //隐式定义
         var arr1 =[];
         console. log( arr1);
         var arr2= [1,2, "a" ,true];
         console.log( arr2);
         
         //直接实例化
         var arr3 = new Array ( 1,2,3);
         console.log( arr3);
         
         //定义数组并设置长度
         var arr4 = new Array(5);
         console.log(arr4);
         
         console.log("=-=---=--===");/*数组的操作 */
         //获取指定下标的值
         console.log( arr2[1]);// 2
         //如果下标不存在
         console.log(arr2[10]); // undefined
         //设置指定下标的值
         arr2[1]=20;
         console.log ( arr2);
         //如果下标不存在
         arr2[10] = 100;
         console.log( arr2); 
        //获取数组的长度
        console.log( arr3. length); // 3
          //设置数组的长度
        arr3. length = 5;
        console.log(arr3);
        //设置数组的属性
        arr3.name= "zhangsan" ;
        console.log(arr3);
        arr3 [ "pwd" ] ="123456";
        console. log( arr3);
        //获取数组的属性
        console. log(arr3[ "name" ]);
 
 
         console. log("----------    ==");
         /*数组的遍历*/
         console. log(arr3);
         console. log("----for循环遍历----" );
         // for循环遍历
         for( var i = 0; i < arr3.length; i++) {
            console.log("索引:" + i +",值:"+ arr3[i])
        }
        console. log("----for...in----" );
        //for. . .in
        console.log("- --for . . .in----");for (var i in arr3) {
        console. log("下标:" +i + ",值:"+arr3[i]);
        }
        // forEach
        console.log("---forEach-- --" );
        arr3.forEach(function(element,index){
        console.log("下标:" + index +",值: "+ element);
        })
 
         /*数组提供的方法*/
         // push     添加元素到最后
         // index0f  数组元素索引
         // join     数组转成字符串
         // split    字符串方法:将字符串转换成数组
 
          console. log("----------    ==");
          var arr5 = ["a","b","c"];
          // push   添加元索到最后
          arr5[arr5.length] = "d";
          arr5. push("e");
          console. log(arr5);
          
          // indexOf    数组元素索引
          console. log(arr5. indexOf("a")); // 0
          console. log(arr5. indexOf("t")); // -1, 找不到返回-1
 
          // join   数组转成字符串
          console. log(arr5.join("-")); // a-b-c-d-e
 
          // split 字符串方法:将字符串转换成数组
          var str = "1,2,3,4,5";
          console. log(str  .split(","));
 
          
          
         </script>
二.函数

        函数的定义
            1.函数声明语句
                function函数名([参数列表]) {
            }
            2.函数定义表达式
                var变量名/函数名= function([参数列表]) {
            }
            3. Function构造函数  (了解)
                var函数名= new Function([参数列表],函数体);
                
        函数的参数
            定义函数时设置形参,调用函数时传递实参。
            1.实参可以省略,则形参为undefinded
            2.如果形参名相同,则以最后一个参数为准
            3.可以设置参数的默认值
            4.参数为值传递,传递副本;参数是是引用传递,则传递的是地址,操作的是同一个对象
            
        函数的调用
            1.常用调用模式
                函数名([参数列表]);
            2.函数调用模式(函数有返回值)
                var变量名=函数名([参数列表]);
            3.方法调用模式
                对象.函数名([参数列表]);
        函数的返回值
            return
            1.在没有返回值的方法中,用来结束方法。(如果方法没有返回值, 使用return, 返回的是undefinded
            2.有返回值的方法中,一个是用来结束方法,一个是将值带给调用者。

        函数的作用域
            在JS中,只有在函数中才作用域。
            1.在函数中,存在局部变量和全局变量
            2.在函数中,如果声明变量时未使用var修饰符,则该变量是全局变量

 <script type="text/javascript">
         
         
         /*函数的定义 */
         // 1.函数声明语句
         function fn01(a,b) {
                     console.log(a+b);
         }
         console. log(fn01);
         // 2.函数定义表达式
         var fn02 = function(a,b) {
                     console.log(a+b);
         }
         console. log(fn02);
         // 3. Function构造函数
         var fn03 = new Function('a','b','return (a+b);');
          console. log(fn03);
          //相当于
          function fn04(a,b) {
          return (a + b);
         }
         
         
         /* 函数的参数 */
         // 1.实参可以省略,则形参为undefinded
         
         
         function test01(x,y){
             console.log(x+y);
         }
         //调用函数
         //未设置实参
         test01(); // NaN
         test01(1); // NaN
         test01(1,2); // 3
         
         // 2.如果形参名相同,则以最后一 个参数为准
         function test02(x,x) {
             console.log(x);
             }
         test02(1,2); // 2
         // 3.可以设置参数的默认值
         function test03(x) {
             // 如果形参x有值,则值为x传递的值;否则值为"x"
             x= x || "x";
             console.log(x);
         }
         test03(10); // 10
         test03(); // X
         function test04(x) {
         (x != null && x != undefined) ?x=x:x="x" ;
         console.log(x);
         }
         test04(); // x
         test04("Hello");
         // 4.参数为值传递,传递副本;参数是是引用传递,则传递的是地址,操作的是同一个对象
         //值传递
         var num=10;//变量
         // //函数
          function test05 (num) {
          num = 20;
          }
          //调用函数
          test05(num); //实参是定义的变量
          console.log(num);
          
          //引用传递
          var obj = {name: "zhangsan"};
          console.log(obj);
          function test06(o) {
          o.name = "lisi";
          }
          test06(obj);
          console. log(obj);
          
          
          console.log("==============")
          /* 函数的调用 */
          //常用调用模式
          function f1() {
          console. log("常用调用模式...");
          }
          f1();
          //函数调用模式
          var f2 = function(a) {
          console. log("函数调用模式...");
          return a
          }
            var num1 = f2(1);
            console. log(num1);
            //方法调用模式
            //定义对象    key键:字符串 value值: 任意数据类型
        var obj={
            name: "zhangsan", //字符串
            age:18,//数值
            sex:true, //布尔
            cats:["大毛","二毛"],//数组
            dog:{ //对象
                name :"张二狗",
                age:1
            },
            sayHello:function(){ //函数
                console. log("你好呀~");
            },
            }
            console. log(obj);
            console. log(obj. sayHello()); //对象调用函数
            obj. sayHello()//对象调用函数
 
 
 
            console. log("============");
            /*函数的返回值*/
            function a1(){
                console.log("没有返回值...");
                return;
                console.log('........');
                }
            console.log(a1());
            
            function a2 (){
            console. log("有返回值...");
            return "test";
            }
            console.log(a2());
 
             console.log("===============");
             /*函数的作用域*/
             var pp = "Hello"; //全局变量
             //函数中定义的变量是局部变量
             function qq() {
                //局部变量
                var box = 10;
                // 全局变量   没有使用var修饰
                box2 = 20;  
             }
             // 调用方法,执行方法中的代码
             qq();
             console.log(pp); //全局变量
             /* console.log(box);      box是局部变量*/
             console.log(box2);
 

举报

相关推荐

0 条评论