JS中var声明与function声明以及构造函数声明方式的区别

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

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

对应第一种情况，

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