js (JavaScript)函数声明的几种形式及用法

1、函数声明

语法:

function functionName(parameters) {
  执行的代码
}

函数声明后不会立即执行,只是在初始化的时候会将函数声明提升,会在我们需要的时候调用到。

2、函数表达式(匿名函数)

语法:

var x = function (a, b) {return a * b};var z = x(4, 3);

以上函数实际上是一个 匿名函数 (函数没有名称)。

函数存储在变量中,不需要函数名称,通常通过变量名来调用。

3、Function() 构造函数

通过内置的 JavaScript 函数构造器(Function())定义。

语法:

var myFunction = new Function("a", "b", "return a * b");

var x = myFunction(4, 3);

实际上,你不必使用构造函数。上面实例可以写成:

var myFunction = function (a, b) {return a * b};

var x = myFunction(4, 3);

4、自调用函数

函数表达式可以 "自调用"。

自调用表达式会自动调用。

如果表达式后面紧跟 () ,则会自动调用。

不能自调用声明的函数。

通过添加括号,来说明它是一个函数表达式:

(function () {
    var x = "Hello!!";      // 我将调用自己
})();

//为一个匿名自调用函数

5、箭头函数

ES6 新增了箭头函数。

箭头函数表达式的语法比普通函数表达式更简洁。

语法:

(参数1, 参数2, …, 参数N) => { 函数声明 }

(参数1, 参数2, …, 参数N) => 表达式(单一)
// 相当于:(参数1, 参数2, …, 参数N) =>{ return 表达式; }

当只有一个参数时,圆括号是可选的:

(单一参数) => {函数声明}
单一参数 => {函数声明}

没有参数的函数应该写成一对圆括号:

() => {函数声明}

例:

// ES5
var x = function(x, y) {
     return x * y;
}

// ES6
const x = (x, y) => x * y;

有的箭头函数都没有自己的 this。 不适合顶一个 对象的方法

当我们使用箭头函数的时候,箭头函数会默认帮我们绑定外层 this 的值,所以在箭头函数中 this 的值和外层的 this 是一样的。

箭头函数是不能提升的,所以需要在使用之前定义。

使用 const 比使用 var 更安全,因为函数表达式始终是一个常量。

如果函数部分只是一个语句,则可以省略 return 关键字和大括号 {},这样做是一个比较好的习惯:

6、使用函数注意点

(1)、函数提升

  • 在之前的教程中我们已经了解了 "hoisting(提升)"。
  • 提升(Hoisting)是 JavaScript 默认将当前作用域提升到前面去的的行为。
  • 提升(Hoisting)应用在变量的声明与函数的声明。
  • 因此,函数可以在声明之前调用:
myFunction(5);

function myFunction(y) {
    return y * y;
}

注意:使用表达式定义函数时无法提升。

(2)、函数式对象

  • 在 JavaScript 中使用 typeof 操作符判断函数类型将返回 "function" 。
  • 但是JavaScript 函数描述为一个对象更加准确。
  • JavaScript 函数有 属性 和 方法
  • arguments.length 属性返回函数调用过程接收到的参数个数:
function myFunction(a, b) {    //2
    return arguments.length;
}

  toString() 方法将函数作为一个字符串返回:

function myFunction(a, b) {
    return a * b;
}

var txt = myFunction.toString();     //function myFunction(a, b) { return a * b; }

原文地址:https://www.cnblogs.com/art-poet/p/12111592.html

时间: 2024-10-11 07:50:33

js (JavaScript)函数声明的几种形式及用法的相关文章

JS中函数声明与函数表达式的不同

Js中的函数声明是指下面的形式: function functionName(){ } 这样的方式来声明一个函数,而函数表达式则是类似表达式那样来声明一个函数,如: var functionName = function(){ } 可能很多朋友在看到这两一种写法时会产生疑惑,这两种写法差不多,在应用中貌似也都是可行的,那他们有什么差别呢? 事实上,js的解析器对函数声明与函数表达式并不是一视同仁地对待的.对于函数声明,js解析器会优先读取,确保在所有代码执行之前声明已经被解析,而函数表达式,如同

Javascript函数声明与函数表达式的区别

在定义函数时,我们一般使用下面这两种方法: 使用函数声明定义: 1 2 3 function  sum (a, b) {     return a + b; } 使用函数表达式定义: 1 2 3 var sum = function (a, b) {     return a + b; } 调用方法都是一样的: 如求"1+1"等于几: 1 alert(sum(1, 1)); 但这两种方法还是有区别的.解析器在向执行环境中加载数据时,对函数声明和函数表达式并非一视同仁.解析器会率先读取函

js判断变量初始化的三种形式

<1> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript"> //js判断变量初始化有三种形式 var x; if (x == null) { alert("x为null"); } if (typeof (x) == "un

js 函数function的几种形式

1 //有的时候我们一直都在使用函数,但是却不知道函数使用的正真含义 2 //其中一个重要的目的是为了提高代码的复用率 3 //其二函数可以传递参数并有返回值 4 //函数声明 5 6 //不带参数,不带返回值 7 function add(){ 8 var arr=Array("大海","小河","山川"); 9 10 for(var i in arr){ 11 console.log(arr[i]); 12 } 13 } 14 15 add(

JS匿名函数声明,调用;JS闭包详解(转载)

js匿名函数的代码如下:(function(){ // 这里忽略jQuery 所有实现 })(); 半年前初次接触jQuery 的时候,我也像其他人一样很兴奋地想看看源码是什么样的.然而,在看到源码的第一眼,我就迷糊了.为什么只有一个匿名函数又没看到运行(当然是运行了…… ),就能有jQuery 这么个函数库了?于是,我抱着疑问来到CSDN .结果相信现在很多人都很清楚了(因为在我之 后也不乏来者,呵呵~ ).当一个匿名函数被括起来,然后再在后面加一个括号,这个匿名函数就能立即运行起来!真神奇哦

javascript 函数声明和函数表达式

定义js函数的方法有两种,1.函数声明 2.函数表达式 这两种方式的区别是:1.函数声明可以先调用后定义(javascript引擎在解释的时候会把所有的函数声明提升)2.函数表达式必须先定义后使用.看下面例子直观区别 函数声明 myCount();//正确,可以先调用 //定义,函数声明 function myCount() { console.log("hello js"); } myCount();//正确,可以后调用 函数表达式 myCount();//错误,提示未定义 //函数

JavaScript 函数声明和变量声明

声明语句:声明语句是用来声明或定义标识符(变量和函数名)并给其赋值. 1:var 变量声明(5.3.1节): var语句用来声明一个或多个变量:var name_1 = [= value_1] [ ,..., name_n [= value_n]] var i; var j = 0; var x=1, y=2; var pi = 3.14, f = function(x) {return x*x}, k = f(x); 2:遗漏声明(3.9节) 读取一个没有声明的变量的值:JavaScript会

javascript 函数声明和函数表达式的区别(学习笔记)

javascript中声明函数的方法有两种:函数声明式和函数表达式. 区别如下: 1).以函数声明的方法定义的函数,函数名是必须的,而函数表达式的函数名是可选的. 2).以函数声明的方法定义的函数,函数可以在函数声明之前调用,而函数表达式的函数只能在声明之后调用. 3).以函数声明的方法定义的函数并不是真正的声明,它们仅仅可以出现在全局中,或者嵌套在其他的函数中,但是它们不能出现在循环,条件或者try/catch/finally中,而 函数表达式可以在任何地方声明. 下面分别用两种方法定义函数:

javascript函数命名的三种方式及区别

1, function fn(val1,val2) { alert(val1+val2); } fn(1,2); 2, var fn=function() { alert(val1+val2); } fn(1,2); 3, var fn=new Function("alert(val1+val2)"); fn(1,2); 上面三种方式逻辑上是等价的,但是还是有点小区别: 区别一:例一中的函数会在代码执行以前被加载到作用域中,而例二则是在代码执行到那一行的时候才会有定义: 区别二:函数声