JS中创建函数的三种方式及区别


Posted in Javascript onMarch 13, 2016

1.函数声明

function sum1(n1,n2){
    return n1+n2;
  };

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

var sum2=function(n1,n2){
    return n1+n2;
};

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

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

(function(n1,n2){
    console.log (n1+n2)
})(1,3);//4

另外几种自执行函数:

//可用来传参
  (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.函数构造法,参数必须加引号

var sum3=new Function('n1','n2','return n1+n2');
console.log(sum3(2,3));//5

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

var name='haoxl';
  function fun(){
    var name='lili';
    return new Function('return name');//不能获取局部变量
  }
 console.log(fun()());//haoxl

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

Javascript 相关文章推荐
Javascript学习笔记7 原型链的原理
Jan 11 Javascript
JavaScript中的关键字"VAR"使用详解 分享
Jul 31 Javascript
angularjs实现与服务器交互分享
Jun 24 Javascript
浅析创建javascript对象的方法
May 13 Javascript
详解Vue-基本标签和自定义控件
Mar 24 Javascript
web前端vue之vuex单独一文件使用方式实例详解
Jan 11 Javascript
JS实现左边列表移到到右边列表功能
Mar 28 Javascript
vue实现element-ui对话框可拖拽功能
Aug 17 Javascript
10种JavaScript最常见的错误(小结)
Jun 21 Javascript
vue遍历生成的输入框 绑定及修改值示例
Oct 30 Javascript
js实现无缝轮播图插件封装
Jul 31 Javascript
QT与javascript交互数据的实现
May 26 Javascript
使用jQuery操作HTML的table表格的实例解析
Mar 13 #Javascript
Javascript数组Array方法解读
Mar 13 #Javascript
GitHub上一些实用的JavaScript的文件压缩解压缩库推荐
Mar 13 #Javascript
Javascript数组Array基础介绍
Mar 13 #Javascript
深入探究JavaScript中for循环的效率问题及相关优化
Mar 13 #Javascript
简单谈谈json跨域
Mar 13 #Javascript
详解JavaScript中数组和字符串的lastIndexOf()方法使用
Mar 13 #Javascript
You might like
php下几个常用的去空、分组、调试数组函数
2009/02/22 PHP
php 目录遍历、删除 函数的使用介绍
2013/04/28 PHP
PHP 登录完成后如何跳转上一访问页面
2014/01/14 PHP
PHP之sprintf函数用法详解
2014/11/12 PHP
PHP学习笔记(三):数据类型转换与常量介绍
2015/04/17 PHP
laravel框架创建授权策略实例分析
2019/11/22 PHP
javascript 系统文件夹文件操作及参数介绍
2013/01/08 Javascript
Javascript实现的常用算法(如冒泡、快速、鸽巢、奇偶等)
2014/04/29 Javascript
如何让浏览器支持jquery ajax load 前进、后退功能
2014/06/12 Javascript
jQuery+css实现的换页标签栏效果
2016/01/27 Javascript
基于JS实现数字+字母+中文的混合排序方法
2016/06/06 Javascript
微信小程序 网络API Websocket详解
2016/11/09 Javascript
JS回调函数基本定义与用法实例分析
2017/05/24 Javascript
Angular+Bootstrap+Spring Boot实现分页功能实例代码
2017/07/21 Javascript
Angularjs之如何在跨域请求中传输Cookie的方法
2018/06/01 Javascript
highCharts提示框中显示当前时间的方法
2019/01/18 Javascript
这样回答继承可能面试官更满意
2019/12/10 Javascript
python使用htmllib分析网页内容的方法
2015/05/08 Python
Python使用redis pool的一种单例实现方式
2016/04/16 Python
python 删除列表里所有空格项的方法总结
2018/04/18 Python
python调用百度语音识别api
2018/08/30 Python
python hook监听事件详解
2018/10/25 Python
Pandas GroupBy对象 索引与迭代方法
2018/11/16 Python
Django利用cookie保存用户登录信息的简单实现方法
2019/05/27 Python
pyinstaller打包单个exe后无法执行错误的解决方法
2019/06/21 Python
Django框架视图函数设计示例
2019/07/29 Python
基于Pycharm加载多个项目过程图解
2020/01/19 Python
在Django中预防CSRF攻击的操作
2020/03/13 Python
使用AJAX和Django获取数据的方法实例
2020/10/25 Python
英国二手物品交易网站:Preloved
2017/10/06 全球购物
介绍一下EJB的分类及其各自的功能及应用
2016/08/23 面试题
应聘医药销售自荐书范文
2014/02/08 职场文书
党的群众路线学习材料
2014/05/16 职场文书
团日活动总结格式
2015/05/11 职场文书
天堂的孩子观后感
2015/06/11 职场文书
如何解决.cuda()加载用时很长的问题
2021/05/24 Python