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

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

对应第一种情况,

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

posted @ 2019-02-27 15:40  橱窗外的小孩  阅读(...)  评论(...编辑  收藏