资讯专栏INFORMATION COLUMN

函数基本概念

Lycheeee / 3112人阅读

摘要:返回相加的和永远也不会执行函数参数声明函数时没有给参数,但调用函数时会传参。当网页在全局作用域中调用函数时,这个对象引用的就是。

函数

通过函数可以封装任意多条语句,可以在任何地方,任何时候调用执行。每个函数都是function类型的实例,和其他引用类型一样具有属性和方法。
把函数保存为对象中的一个属性时,该属性称之为方法

函数声明语法方式

普通声明方式

function sum (){
        return num1 + num2;
}

使用变量初始化函数

var sum = function(num1,num2){
        return num1 + num2;
}

使用function构造函数,这种方法不推荐。这种方法便于理解“函数是对象,函数名是指针”的概念。

var sum = new Function("num1","num2","return num1 + num2");

delete可删除属性,用法delete.a.name

作为值的函数

任何函数在任何时候都可以通过return语句来返回值。需要注意的是位于return语句之后的一句语句永远不会执行。
调用函数(方法)如果没有圆括号,会打印函数代码,有括号才会打印函数值。

function sum(num1,num2){
    return num1 + num2;        //返回 num1 + num2 相加的和
    alert("Hello world!");    //永远也不会执行
} 
函数参数

声明函数时没有给参数,但调用函数时会传参。
函数内部可用argument方法获取,配合length使用可动态传参。

function sum(){
    if(arguments.length == 1){
        alret(arguments[0] + 10);
    }else if(arguments.length == 2){
        alert(arguments[0] + arguments[1] + 10);
    }
}

sum(10)        //打印20
sum(10,20)    //打印40
JavaScript 函数没有重载

重载是根据参数,选择相同函数名而参数不同的函数。

阶乘函数
function factorial(){
    if(num < 1){
        return 1;
    }else{
        return num * arguments.callee(num -1);//arguments.callee调用自身函数。这里调用的是factorial函数。
    }
}
this

this引用的是函数执行的环境对象,也就是函数调用语句所处的那个作用域。当网页在全局作用域中调用函数时,这个this对象引用的就是windowwindow是一个对象,而且是JS里最大的对象,是最外围的对象。

var color = "red";        //这里color是全局变量,而这变量又是window的属性
alert{window.color};    //打印"red",这说明color是window下的属性
alert(this.color);        //同上
window.color = "red";    //相当于 var color = "red"
alert(this.color);        //打印"red"

var o ={
    color: "blue";        //这里的color是o下的属性,也就是局部变量
    sayColor: function(){
        alert(this.color);    //这里的this代表的是o对象
    }
};

o.sayColor();            //打印"blue"

下面的代码其实和上面是一样的,只是将sayColor()函数作为方法赋值给o,然后在通过o来调用它

window.color = "red";        //全局        
var o = {color: "blue"};    //局部

function sayColor(){        
    alert(this.color);        //这里执行的时候是动态的,第一次指向window,第二次指向sayColor
}

sayColor();                    //打印"red",因为这里是在window下的
o.sayColor = sayColor;        //这里是吧把sayColor作为方法赋值给o,这样的话this就指代o了
o.sayColor();                //这里执行的是box里面的this.color,也就是说这里this指向了box
prototype

prototype是保存他们所有实例方的真正所在,toStringvalueOf等方法都是保存在peototype名下,只不过是通过各自对象的实例访问。
每个函数都包含两个非继承而来的方法:apply()call()这两个方法的用途都是在特定的作用域中调用函数,实际上等于设置函数体内this对象的值。
apple()接收两个参数,一个是其中运行函数的作用域,另一个是参数数组。
call()apple()方法一样,区别是call()方法传递给函数的参数必须逐个传。

function sum(num1,num2){
    return num1 + num2;
}

function sum1(nu1,num2){
    return sum.apply(this,arguments);    //arguments可以当数值传,等于下面的[num1,num2];this表示window作用域
}

function sum2(nu1,numw){
    return sum.apply(this,[num1,num2]);    //apply可以冒充另一个函数,这里冒充了sum;[]表示传递的参数 
}

alert(sum1(10,10));        //打印20
alert(sum2(10,10));        //打印20

这两方法最大的用处是:扩充函数运行的作用域。

window.color = "red";        //全局        
var o = {color: "blue"};    //局部

function sayColor(){        
    alert(this.color);        //这里this是动态的
}

sayColor();                    //打印"red"

//用call实现对象冒充
sayColor.call(this);        //冒充window
sayColor.call(window);        //冒充window
sayColor.call(o);            //冒充sayColor,用call的好处:对象不需要与方法发生任何耦合关系(耦合:互相关联的意思,扩展和维护会发生连锁反应)

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/94457.html

相关文章

  • 熬夜爆肝!C++核心STL容器知识点汇总整理【3W字干货预警 建议收藏】

    摘要:拷贝构造函数示例构造无参构造函数总结容器和容器的构造方式几乎一致,灵活使用即可赋值操作功能描述给容器进行赋值函数原型重载等号操作符将区间中的数据拷贝赋值给本身。清空容器的所有数据删除区间的数据,返回下一个数据的位置。 ...

    wayneli 评论0 收藏0
  • js的基本概念

    JavaScript 中的数据类型 JavaScript 有 5 种简单数据类型:Undefined、Null、Boolean、Number、String 和 1 种复杂数据类型 Object 。 基本类型(值类型) Undefined Null Boolean Number String 复杂类型(引用类型) Object Array Date RegExp Function 基本包装类...

    sherlock221 评论0 收藏0
  • 复习Javascript专题(一):基本概念部分

    摘要:一数据类型基本类型引用类型类型判断返回结果未定义布尔值字符串数值对象或者函数拓展堆栈两种数据结构堆队列优先,先进先出由操作系统自动分配释放,存放函数的参数值,局部变量的值等。 一、数据类型 基本类型:`Null Boolean String Undefined Number(NB SUN)` 引用类型:`Array Function Object` 类型判断:typeof 返回结果...

    LiangJ 评论0 收藏0
  • Array基本概念

    摘要:基本概念可以使用关键字创建。调用时传入一个数组和一个函数,内部过程遍历数组,并对数组中的每一项调用函数,调用函数的时候会传入两个参数,这个数组有项,传次,每次不一样的不一样的。会按照升序排列数组。 Array基本概念 Array可以使用new关键字创建 。var a = new Array(1,2,3,4); === var a = Array(1,2,3,4); === var a...

    Alfred 评论0 收藏0

发表评论

0条评论

Lycheeee

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<