JS中常见的三种函数声明(statement)方式有这三种:

// 函数表达式(function expression)
var h = function () {
// h
} // 函数声明(function declaration)
function h() {
// h
}
// 构造函数(function constructor)
function H() {
    // H 
}

先说三者的显著区别:

第一种声明方式也就是var声明方式,函数表达式,又叫做函数字面量(Function Literals)、函数直接量(Function direct quantity), 函数只有在var语句声明之后才能被调用

第二种声明方式也就是function声明方式,函数可以在function声明之前被调用

第三种声明方式也就是构造函数声明方式,函数可以在function声明之前被调用,不同于函数声明的是构造函数的函数名首字母要大写

因为在函数预编译过程中,会将函数声明整体提升,而对于var变量只会把var h进行提升,然后再在代码运行阶段进行赋值

对第一种情况,函数表达式是在函数运行阶段才赋值给变量h

对第二种情况,函数声明是在代码运行阶段之前,也就是代码解析阶段才赋值给标识符h

对第三种情况,构造函数也是在代码运行阶段之前,也就是代码解析阶段才赋值给标识符H

为了证明这种说法可以看下面两个例子:

对应第一种情况,

console.log(h)  // undefined
var h = function () {
// h
} console.log(h)  // function () {//h} h = function () {
// h1
}

console的结果是

undefined

ƒunction () {
  // h
}

因为赋值发生在代码运行阶段, 代码自上而下运行console.log(h)所在位置只能获取它之前的赋值

对应第二种情况,第三种情况,

console.log(h)  // function h() {//h}
function h() {
// h
} console.log(h)  // function h() {//h}
function h() {  
    // h1
}

console的结果是

ƒunction h() {
   // h1
}
ƒunction h() {
   // h1
}

因为赋值发生在代码解析阶段,代码运行到console.log(h)时解析早已完成, 而解析的结果是后面那个函数h,故会打印此结果

深入:

JS声明函数的三种方式:

1. 函数表达式: 即上面第一种方式,这种方法使用function操作符创建函数,表达式可以存储在变量或者对象属性里。函数表达式往往被称为

匿名函数,因为它没有名字。证明这一点你可以 console.log(h.name); 可以看到打印为空 "",而h只是对函数的引用,不是函数名。

2. 函数声明: 即上面第二种方式,会声明一个具名函数,且函数能在其所在作用域的任意位置被调用,其创建的函数为具名函数,证明这一

点你可以 console.log(h.name); 可以看到打印为 "h"。 可在后面的代码中将此函数通过函数名赋值给变量或者对象属性

3. 构造函数function Fun(){}:不推荐这种用法,容易出问题,通常用于原型链中

深入了解函数字面量和函数直接量:

https://blog.csdn.net/qq_25178609/article/details/51669870  https://blog.csdn.net/superhoy/article/details/52946157

JS中var声明与function声明以及构造函数声明方式的区别的更多相关文章

  1. js中var的有或无--重复声明和以后的声明

    js中var的有或无--重复声明和以后的声明 使用var语句多次声明一个变量不仅是合法的,而且也不会造成任何错误. 如果重复使用的一个声明有一个初始值,那么它担当的不过是一个赋值语句的角色. 如果重复 ...

  2. 浅谈JS中 var let const 变量声明

    浅谈JS中 var let const 变量声明 用var来声明变量会出现的问题: 1. 允许重复的变量声明:导致数据被覆盖 2. 变量提升:怪异的数据访问.闭包问题 3. 全局变量挂载到全局对象:全 ...

  3. 【前端开发】】js中var写和不写的区别

    js中var用与不用的区别 Javascript声明变量的时候,虽然用var关键字声明和不用关键字声明,很多时候运行并没有问题,但是这两种方式还是有区别的.可以正常运行的代码并不代表是合适的代码. v ...

  4. JS中innerHTML、outerHTML、innerText 、outerText、value的区别与联系?jQuery中的text()、html()和val()

    一.JS中innerHTML.outerHTML.innerText .outerText.value的区别与联系?jS中设置或者获取所选内容的值:①innerHTML :属性设置或返回该标签内的HT ...

  5. js中 var functionName = function() {} 和 function functionName() {} 两种函数声明的区别

    js中有两种声明函数的方法,分别为: var functionOne = function() { // Some code }; function functionTwo() { // Some c ...

  6. JS中var声明与function声明两种函数声明方式的区别

    JS中常见的两种函数声明(statement)方式有这两种: // 函数表达式(function expression) var h = function() { // h } // 函数声明(fun ...

  7. js中 var functionName = function() {} 和 function functionName() {} 两种函数声明的区别 (译)

    stackOverflow中看到了很久以前问的一个关于函数声明的问题,问题对函数剖析的特别深.这里翻译了一下组织成一篇小博文,加深一下对这两种声明方式的印象.虽是老调重弹,但是只要能帮助理解问题,不管 ...

  8. JavaScript中var变量引用function与直接声明function

    今天在h5开发app的过程中遇到了一个js问题,function的执行问题 在js中声明函数function有这两种方法 var A=function(){...} 或者 function A(){. ...

  9. js中var的重复声明

    腾讯的一个笔试题,先看一下 var a = 100;function fn() { alert(a); //undefined var a = 200; alert(a); //200}fn();al ...

随机推荐

  1. python 登录并获取session,使用session新增ecshop的草稿

    ,"consignee":"冬天","email":"12345@qq.com","address" ...

  2. python requests访问https的链接,不打开fiddler的情况下不报错;若是打开fiddler则报ssl错误,请求中添加verify=False,会报警告;若不想看到警告,有3种方式;

    import requests# import warnings# warnings.filterwarnings("ignore") #方法一#requests.packages ...

  3. 201871010123-吴丽丽 《面向对象程序设计(Java)》第十四周学习总结

    项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/ 这个作业的要求在哪里 https://www.cnblogs.com/nwnu-daizh/p ...

  4. SysML——CSE 599W: Systems for ML

    CSE 599W: Systems for ML Assignments Materials Projects Schedule Schedule The schedule is tentative ...

  5. machine_math

    1.导数与函数的凹凸性关系: 从下往上看,如果函数是凸出来的就是凸函数,如果是凹的就是凹函数. 函数的凹凸性是二阶函数来判断的. 如果二阶函数大于零,那么就是凸函数,否则就是凹函数. 2.一阶导数为零 ...

  6. 关于Design Complier/Library Compiler的跌坑(坑爹)记录

    最近需要用DC做一些事,然后需要转库,中午偷个闲,特来记录一下中间的一些坎坷. 1.首先是要转库.我们只有.lib文件的格式,所以需要把.lib文件转换成.db格式.然后坑来了!!!DC2015及以后 ...

  7. android 自定义gridview(导航)

    最近又重新做回安卓,做了个小项目.下绝心使用android studio,通过这一回实战,终于用上了.综合了前人的经验,搞了个自己满意的导航界面,用的是gridview. 代码: package co ...

  8. c# 在DataTable的第一列(指定列)的前面添加一列

    c# 在DataTable的第一列(指定列)的前面添加一列 dt.Columns.Add("ID").SetOrdinal(0)  

  9. 编译和安装openssl

    linux安装了Python3.7之后, pip不好用了,报错如下: pip is configured with locations that require TLS/SSL, however th ...

  10. JavaScript 内存回收机制

    引用 垃圾回收算法主要依赖引用的概念,例如一个对象如果有另外一个对象的访问权限,这里就叫做一个对象引用另外一个对象,不论这里是显式还是隐式 回收机制 Js具有自动垃圾回收机制.垃圾收集器会按照固定的时 ...