手抄报 安全手抄报 手抄报内容 手抄报图片 英语手抄报 清明节手抄报 节约用水手抄报

JavaScript几种函数定义方法

时间:2024-10-21 17:28:47

1、首先我们建一个测试页有了网页基本结构就可以了,我这里建立了一个ul列表,分别放了三行内容“历史”、“新闻”、“体育”,下面我们就基于这个测试页来看看js函数的定义和使用

JavaScript几种函数定义方法
JavaScript几种函数定义方法

2、第一个我们要看的是匿名函数,匿名函数在页面中会直接执行,定义的方式是(function(){//函数内容})(); 最后面的一对小括号里面可以传参。图中实现了一个匿名函数,传递了一个字符串数组,我们在匿名函数中输出了一下,大家可以看到,我们不用调用匿名函数,他只要在页面上就会立即执行,这样做有一个好处,那就是他内部通过var定义的变量是他的私有变量,不会被外部引入的js同名变量污染。

JavaScript几种函数定义方法
JavaScript几种函数定义方法

3、第二种定义的方式就是最常用的function定义方式,下图定义了一个show函数,我们在document.ready里面调用它来更改li中的内容。

JavaScript几种函数定义方法
JavaScript几种函数定义方法

4、上面是没有返回值的函数,在我们平时使用函数的时候很多情况下需要返回值,这是这个函数看以看作它返回值的类型,比如return 1 那么这个函数可以看作是一个整形,如果return "你好"它就是字符串型,当然也可以是函数自己或者数组、对象等等。下面实现了一个根据id获取对应html内容的get函数,我们可以看一下代码和输出结果

JavaScript几种函数定义方法
JavaScript几种函数定义方法

5、另外我们为了更好的把函数看作一个特定类型或对象,还有一个定义方法var fname = function(参数){};这种方法跟function定义的方法基本一样。下面我们把之前的get函数改一下看看,测试一下输出结果没有任何变化。

JavaScript几种函数定义方法

6、最后说一下,我个人喜欢用var fname = function(参数){};这种定义函数的方法。另外要注意的是函数中变量的作用域。函数传递进来的参数这个不说了肯定是只能这个函数内部使用。另一种就是函数内部使用var定义的,他属于函数的私有变量,外部也是不能用的(注意我们函数内部定义变量的时候如果没有特殊需求千万不要直接写 变量名=变量值这种方法,因为不加var的变量是一个全局变量,这是很恐怖的事情。)还有一种是定义变量的前面加个this,这时候函数就可以看作一个对象了,我们使用this 变量需要new一下才能使用。下面看个小例子

JavaScript几种函数定义方法
JavaScript几种函数定义方法
© 手抄报圈