JavaScript函数

函数的作用,可以写一次代码,然后反复地重用这个代码。JavaScript的函数也是对象,因此可以把函数赋值给变量,或者作为参数传递给其他函数,因为函数就是对象,所以可以给它们设置属性,甚至调用它们的方法。凡是可以使用值的地方,就能使用函数。

下面的案例我们都可以写在main.js里面,保存之后,打开index.html对应的开发者工具,查看控制台了解实际的效果。

创建与调用函数

定义一个函数并不会自动的执行它。定义了函数仅仅是赋予函数以名称并明确函数被调用时该做些什么。调用函数才会以给定的参数真正执行这些动作。

不带参数的函数

在JavaScript中,每个函数其实都是一个 Function对象,我们可以使用function关键词来创建一个函数。greet是函数名。

greet()函数没有参数,我们不需要在()里面输入值,直接写函数名+括号就可以调用函数了。

只有一个参数的函数

下面定义了一个简单的平方函数square(),square为函数名,number为函数的参数(名称可以自定义),return语句确定函数的返回值。

square(5),就是把5赋值给变量number,然后执行number*number,也就是5*5,然后返回return这个值。

这里的number被称之为形参,而5被称之为实参。大家可以结合案例就能大致了解形参和实参的意思了。

  • 形参是在定义函数时使用的参数,目的是用来接收调用该函数时传进来的实际参数。
  • 是在调用时传递给函数的参数

 

匿名函数

函数声明function在语法上是一个语句,但函数也可以由函数表达式创建,这样的函数没有函数名称(匿名)。

比如上面这个function函数就没有函数名,相当于是把函数的返回值赋值给了变量square。

 

多个参数的函数

函数的参数可以很多个,参数之间用逗号,隔开。下面这个函数和上面写法很接近,但是它不是匿名函数,而是把add()函数的返回值赋值给了常量sum。

上面add函数有3个参数,但是我们传递了4个值(参数)进去,结果并不影响。返回的结果是2+3+4,5并没有用到。

JavaScript允许传入任意个参数而不影响调用,因此传入的参数可以比定义的参数多,但是不能少。也就是说实参的数量可以多于形参但是不能少于形参。

箭头函数

为什么叫箭头函数(Arrow Function)?因为它的定义用的就是一个箭头=>。我们来看两个例子:

箭头函数相当于匿名函数,并且简化了函数定义。箭头函数可以只包含一个表达式,甚至连{ … }和return都可以省略掉。

对象的方法

前面我们已经介绍过对象的方法是一个动词,是一个函数,那我们再来看如何创建并调用一个对象的方法。

从上面的例子可以看到我们仍然可以使用点表示法来调用对象的方法,这个和访问对象的属性没有区别。而调用对象的方法和调用一个函数也是大同小异。

这里的关键字”this”指向了当前代码运行时的对象,this.name相当于是使用点表示法获取了对象的name属性。

嵌套函数

你可以在一个函数里面嵌套另外一个函数。嵌套(内部)函数对其容器(外部)函数是私有的。它自身也形成了一个闭包。闭包是指可以自己拥有独立的环境与变量的的表达式。太难理解了?直接实战看效果即可:

上面的案例有两个函数,

  • 一个是addSquares()函数,它有两个变量,也就是要调用它我们需要传入至少两个参数;它是外部函数,或者说是容器函数;
  • 一个是square()函数,它有一个变量,要调用它需要传入一个参数;它是内部函数,或者说它是嵌套函数

我们在调用addSquares()函数的时候,只为addSquares()函数传入了两个参数,并没有为square()函数传参,但是内部函数可以继承外部函数的参数和变量。也就是说参数a和b是addSquares()函数的形参,同时也是square()函数的实参。

闭包是 JavaScript 中最强大的特性之一。内部函数形成了一个闭包:它可以访问外部函数的参数和变量,但是外部函数却不能使用它的参数和变量。

类Class

ES6 提供了更接近传统语言的写法,引入了 Class(类)这个概念,作为对象的模板。通过 class关键字,可以定义类。

这里的prototype大家可以暂时不用深入理解,只需要知道我们要给一个对象创建属性和方法的时候会使用到它就可以了。结合我们之前学的对象的知识来理解。上面的写法与下面的写法是一样的,只不过看起来更加简单清晰:

constructor方法,这就是构造方法,而this关键字则代表实例对象。

class类可以看成是一个语法糖,它的写法用传统的方式也可以写出来,但是有了class类可以让对象原型的写法更加清晰、更像面向对象编程。

本节任务

  1. 掌握创建函数和调用函数;
  2. 了解如何调用对象的方法;
  3. 了解箭头函数;
  4. 了解类Class