JavaScript创建函数的三种方式

简介:

1.函数声明

1

2

3

function sum1(n1,n2){

    return n1+n2;

  };

2.函数表达式,又叫函数字面量


1

2

3

var sum2=function(n1,n2){

    return n1+n2;

};

两者的区别:解析器会先读取函数声明,并使其在执行任何代码之前可以访问;而函数表达式则必须等到解析器执行到它所在的代码行才会真正被解释执行。

自执行函数严格来说也叫函数表达式,它主要用于创建一个新的作用域,在此作用域内声明的变量,不会和其它作用域内的变量冲突或混淆,大多是以匿名函数方式存在,且立即自动执行。

1

2

3

(function(n1,n2){

    console.log (n1+n2)

})(1,3);//4

另外几种自执行函数:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

//可用来传参

(function(x,y){

  console.log(x+y);

})(2,3);

//带返回值

var sum=(function(x,y){

  return x+y;

})(2,3);

console.log(sum);

~function(){

  var name='~'

  console.log(name);

}();

!function(){

  var name='!'

  console.log(name);

}();

;(function(){

  var name=';'

  console.log(name);

})();

-function(){

  var name='-'

  console.log(name);

}();

//逗号运算符

1,function(){

  var name=',';

  console.log(name);

}();

//异或

1^function(){

  var name='^';

  console.log(name);

}();

//比较运算符

1>function(){

  var name='>';

  console.log(name);

}();

~+-!(function(){

  var name='~+-!';

  console.log(name);

})();

~!(function(){

  var name='~!';

  console.log(name);

})();

(function(){

  var name='call';

  console.log(name);

}).call();

(function(){

  var name='apply';

  console.log(name);

}).apply();

3.函数构造法,参数必须加引号

1

2

var sum3=new Function('n1','n2','return n1+n2');

console.log(sum3(2,3));//5

从技术角度讲,这是一个函数表达式。一般不推荐用这种方法定义函数,因为这种语法会导致解析两次代码(第一次是解析常规ECMAScript代码,第二次是解析传入构造函数中的字符串),从而影响性能。

1

2

3

4

5

6

var name='haoxl';

  function fun(){

    var name='lili';

    return new Function('return name');//不能获取局部变量

  }

 console.log(fun()());//haoxl

 Function()构造函数每次执行时都会解析函数主体,并创建一个新的函数对象,所以当在一个循环或频繁执行的函数中调用Function()构造函数效率是非常低的。而函数字面量却不是每次遇到都会重新编译的,用Function()构造函数创建一个函数时并不遵循典型的作用域,它一直把它当作是顶级函数来执行。

内容转载至:http://www.jb51.net/article/80861.htm

相关文章
|
6天前
|
前端开发 JavaScript 数据处理
在JavaScript中,异步函数是指那些不会立即执行完毕,而是会在未来的某个时间点(比如某个操作完成后,或者某个事件触发后)才完成其执行的函数
【6月更文挑战第15天】JavaScript中的异步函数用于处理非同步任务,如网络请求或定时操作。它们使用回调、Promise或async/await。
21 7
|
1月前
|
JavaScript 前端开发
JavaScript 闭包:让你更深入了解函数和作用域
JavaScript 闭包:让你更深入了解函数和作用域
|
2天前
|
设计模式 JavaScript 前端开发
JS 代码中变量和函数的正确写法总结
**代码规范与最佳实践摘要** 1. 使用可读性强的变量名,如`currentDate`代替`yyyymmdstr`。 2. 对同一类型变量使用相似命名,如`getUser()`代替`getUserInfo()`。 3. 变量名应具有描述性,避免使用难以理解的数字,如`MILLISECONDS_IN_A_DAY`代替`86400000`。
17 2
|
3天前
|
JavaScript 前端开发 容器
JavaScript函数学习
JavaScript函数学习
|
4天前
|
SQL 自然语言处理 前端开发
【JavaScript】ECMAS6(ES6)新特性概览(一):变量声明let与const、箭头函数、模板字面量全面解析
【JavaScript】ECMAS6(ES6)新特性概览(一):变量声明let与const、箭头函数、模板字面量全面解析
8 2
|
4天前
|
JavaScript 前端开发 索引
JS中的substr()和substring()函数有什么区别
JS中的substr()和substring()函数有什么区别
|
6天前
|
自然语言处理 JavaScript 前端开发
在JavaScript中,this关键字的行为可能会因函数的调用方式而异
【6月更文挑战第15天】JavaScript的`this`根据调用方式变化:非严格模式下直接调用时指向全局对象(浏览器为window),严格模式下为undefined。作为对象方法时,`this`指对象本身。用`new`调用构造函数时,`this`指新实例。`call`,`apply`,`bind`可显式设定`this`值。箭头函数和绑定方法有助于管理复杂场景中的`this`行为。
36 3
|
8天前
|
JavaScript 前端开发
Node.js 函数
Node.js 函数
13 4
|
22天前
|
JavaScript 前端开发
js中改变this指向、动态指定函数 this 值的方法
js中改变this指向、动态指定函数 this 值的方法
|
4天前
|
JavaScript 前端开发
JavaScript 数组的函数 map/forEach/reduce/filter
JavaScript 数组的函数 map/forEach/reduce/filter

热门文章

最新文章