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()构造函数创建一个函数时并不遵循典型的作用域,它一直把它当作是顶级函数来执行。

js中函数创建的三种方式的更多相关文章

  1. JS中事件绑定的三种方式

    以下是搜集的在JS中事件绑定的三种方式.   1. HTML onclick attribute     <button type="button" id="upl ...

  2. js中定义变量的三种方式const,val,let 的区别

    js中三种定义变量的方式const, var, let的区别. 1.const定义的变量不可以修改,而且必须初始化. 1 const b = 2;//正确 2 // const b;//错误,必须初始 ...

  3. js中原型继承的三种方式

  4. JavaScript 中事件绑定的三种方式

    以下是在 JS 中事件绑定的三种方式.   1. HTML onclick attribute     <button type="button" id="uplo ...

  5. JavaScript学习12 JS中定义对象的几种方式【转】

    avaScript学习12 JS中定义对象的几种方式 转自:  http://www.cnblogs.com/mengdd/p/3697255.html JavaScript中没有类的概念,只有对象. ...

  6. js中声明Number的五种方式

    转载自:http://www.jb51.net/article/34191.htm <!DOCTYPE html> <html> <head> <meta c ...

  7. JavaScript学习12 JS中定义对象的几种方式

    JavaScript学习12 JS中定义对象的几种方式 JavaScript中没有类的概念,只有对象. 在JavaScript中定义对象可以采用以下几种方式: 1.基于已有对象扩充其属性和方法 2.工 ...

  8. 黑马vue---56-58、vue组件创建的三种方式

    黑马vue---56-58.vue组件创建的三种方式 一.总结 一句话总结: 不论是哪种方式创建出来的组件,组件的 template 属性指向的模板内容,必须有且只能有唯一的一个根元素 1.使用 Vu ...

  9. android中解析文件的三种方式

    android中解析文件的三种方式     好久没有动手写点东西了,最近在研究android的相关技术,现在就android中解析文件的三种方式做以下总结.其主要有:SAX(Simple API fo ...

随机推荐

  1. Anaconda+django安装问题

    Anaconda使用中常遇到如下问题: 如果Anaconda不是最新版本,可在Anaconda Prompt中使用如下命令更新至最新版 conda update -n base -c defaults ...

  2. (二)Java工程化--Maven实践

    Maven项目版本号 默认版本号: 1.0-SNAPSHOT 最佳实践是约定该版本为不稳定版本,如果发布一定要删除; 建议的版本规则: 主版本号.次版本号.增量版本号- 如:1.0.0-RELEASE ...

  3. Django之BBS博客项目

    一.登陆功能(验证码) from geetest import GeetestLib from django.contrib import auth #使用极验滑动验证码的登陆 def login(r ...

  4. TCP-IP详解笔记6

    TCP-IP详解笔记6 用户数据报协议和IP分片 UDP是一种保留消息边界的面向数据报的传输层协议. 不提供差错纠正, 队列管理, 重复消除, 流量控制和拥塞控制. 提供差错检测, 端到端(end-t ...

  5. Images corrections preview with lensfun 不同型号镜头预览图 828张 合集

    lensfun 目前支持900多种镜头, 但是网上并没有预览图; 闲暇时间做了800多张预览图合集 下载地址 链接: https://pan.baidu.com/s/1crfhoKKZKnxntvNH ...

  6. Python-爬虫-requests

    简介 #介绍:使用requests可以模拟浏览器的请求,比起之前用到的urllib,requests模块的api更加便捷(本质就是封装了urllib3) #注意:requests库发送请求将网页内容下 ...

  7. uni-app hbuilderX ios离线打包,启动图修改没反应

    最后还是没反应 删除app从新安装, 可参考https://www.jianshu.com/p/47c1377c61d6

  8. 滑动时候报错:Unable to preventDefault inside passive event listener, 移动端滑动性能优化

    https://www.jianshu.com/p/04bf173826aa 记录下  这篇帖子 解决办法1: 在touch的事件监听方法上绑定第三个参数{ passive: false }, 通过传 ...

  9. 使用numpy 将0-1000 中所有偶数转成0 所有奇数转成1

  10. mac svn无法保存密码,JetBrains IDE(WebStrom、IntelliJ IDEA) 反复提示输入密码

    一.vim ~/.subversion/config用vim修改以下四个地方store-passwords = yesstore-plaintext-passwords = yesstore-ssl- ...