在没风的地方找太阳  在你冷的地方做暖阳 人事纷纷  你总太天真  往后的余生  我只要你 往后余生  风雪是你  平淡是你  清贫也是你 荣华是你  心底温柔是你  目光所致  也是你 想带你去看晴空万里  想大声告诉你我为你着迷 往事匆匆  你总会被感动  往后的余生  我只要你 往后余生  冬雪是你  春花是你  夏雨也是你 秋黄是你  四季冷暖是你  目光所致  也是你 往后余生  风雪是你  平淡是你  清贫也是你 荣华是你  心底温柔是你  目光所致  也是你
jQuery火箭图标返回顶部代码 - 站长素材

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);

如果函数调用前使用了 new 关键字, 则是调用了构造函数。

这看起来就像创建了新的函数,但实际上 JavaScript 函数是重新创建的对象:

// 构造函数:
function myFunction(arg1, arg2) {
    this.firstName = arg1;
    this.lastName  = arg2;
}
 
// This    creates a new object
var x = new myFunction("John","Doe");
x.firstName;                             // 返回 "John"

构造函数的调用会创建一个新的对象。新对象会继承构造函数的属性和方法。

构造函数中 this 关键字没有任何的值。 this 的值在函数调用实例化对象(new object)时创建。

 

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

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; }
posted @ 2019-12-28 14:27  艺术诗人  阅读(6759)  评论(0编辑  收藏  举报