JS函数和对象

Posted 李大宝

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS函数和对象相关的知识,希望对你有一定的参考价值。

在本文章中,将对JS中的函数和对象进行一些讲解,不对之处还请之处

一.JS中的函数

1.1无参函数

其形式如下代码所示

 

function box(){
			alert("我是一个函数,只有被调用才会执行");
		}
		box();

 

运行结果如图1.1

                               图1.1

1.2有参函数

有参函数其形式如下

function box(name,age){
        alert("你的名字是"+name+",年龄为"+age);
    }
    box("李大宝",22);

运行结果如图1.2

                               图1.2

1.3return的用法

其形式如下

function box(){
        return "哈哈哈哈";   //return  相当于把这句话字符串返回回来
    }
    //打印出函数调用返回回来的结果
    alert(box());  //box()   调用,相当于box = 哈哈哈哈

运行结果如图1.3

                                    图1.3

1.4return有参数的函数

其形式如下

 function box(name,age){
        return "你的名字是"+name+",年龄为"+age;
    }
    alert(box("李大宝",22));
//  也可以把函数的返回值赋值给一个变量,然后通过变量操作
     var strinfo = box("李大宝",23);
     alert(strinfo);

运行结果如图1.4

                                图1.4

 

其中,return运行中需注意一些问题:当一个函数中有多个return,遇到第一个return,就会终止继续往下执行,第一个return未赋值,则返回undefined

举例如下

function box(){
         return 10;
         return 100;         //当一个函数遇到第一个return,就会终止继续往下执行,
                             //第一个return未赋值,则返回undefined
     }
     alert(box());    

运行结果如图1.5

                                    图1.5

1.5arguments对象

其形式如下

function box(){
        return arguments[0]+"|"+arguments[1]+"|"+arguments[2]+"|"+arguments[3];
    }
    alert(box("李大宝",22,"船舶专业","未婚"));

运行结果如图1.6

                                     图1.6

1.6利用arguments动态求和

其代码如下

function box(){
        var sum = 0;
        for(var i=0;i<arguments.length;i++){
            sum+=arguments[i];
        }
        return sum;
    }
    alert(box(1,2,4));

运行效果如图1.7

                                       图1.7

.JS中的对象

2.1创建一个新的对象

其形式如下

var box = new Object();     //创建一个新的对象
            box.name = "李大宝";
            alert(box.name);

运行效果如图2.1

                                                   图2.1

其中new可以省略

//new 可以省略
        var box = Object();
        alert(box);

运行效果如下图2.2

                                                 图2.2

可用{}创建一个新对象

var box = {};            //字面量方式创建的对象
        alert(box);

效果为图2.3

                                            图2.3

2.3字面量对象的属性

var box = {
            name : "李大宝",                //字面量对象封装数据
            age :22
        };
        alert(box.age);

效果如下图2.4

                                      图2.4

也可以以另一种声明方法

 var box = {
            "name" : "李大宝",                //字面量对象封装数据
            "age" :22                       //属性可以用字符串形式
        };
        alert(box.age);

效果图为2.5

                                         图2.5

2.4给对象创造方法

//给对象创造方法

    var box = {
        name : "李大宝",
        age : 22,
        run: function(){            //匿名函数
            return"123";
        }
    };
    alert(box.run());          //调用函数,如果没有(),会打印代码
                              //有()才会打印返回值

效果如图2.6

                                         图2.6

2.5delete属性

var box = {
            name:"李大宝"
        }
        alert(box.name);          //delete,删除属性
        delete box.name;
        alert(box.name);

其效果如下

                                           图2.7

 

应用举例:自变量对象的传参

function box(obj){
            alert(obj.name);
            alert(obj.age);
            alert(obj.hobby);
        }
        var obj = {
            name:"李大宝",
            age :"22",               //封装对象属性,不会乱
            hobby:"敲代码"
        };
        
        box(obj);

效果图如下图2.8

                                            图2.8

.

.

.

.

由于时间关系,本次讲解到此为止,下一篇博文将继续介绍函数的对象问题

                     <独创声明,未经允许不得转发!!!>

 

以上是关于JS函数和对象的主要内容,如果未能解决你的问题,请参考以下文章

web代码片段

JS的数据类型判断函数数组对象结构处理日期转换函数,浏览器类型判断函数合集

JS作用域作用域链

AJAX相关JS代码片段和部分浏览器模型

js代码片段

VSCode自定义代码片段12——JavaScript的Promise对象