论commonjs中exports, module.exports, this的区别

1. exports和module.exports的区别

我们来看下嘛这段关系

console.log(exports === module.exports); // true

如上所示这两者是相同的, 那他是怎么相同的,再看下面的的代码

module.exports.a = 1;
exports.b = 2;

console.log(exports); // { a: 1, b: 2 }
console.log(module.exports) // { a: 1, b: 2 }

如上所示 exports和module.exports是指向同一块内存的

2. this和exports, module.exports的区别

首先,我们要指出一个观点, commonjs的代码最后是在一个function函数环境来指向执行的,为了验证此观点, 我们做个测试

console.log(arguments.length); // 5

由此可见, 我们的commonjs的代码是在function函数环境执行的, 然后再看this和exports, module.exports的区别

console.log(exports === module.exports); // true
console.log(exports === this); // true
console.log(module.exports === this);  // true

如上代码可见他们是相同的, 即内存指向是相同的, 但是具体是怎么相同的呢, 众所周知, 让this和变量的执行一样的方法有两个, call和apply, 那根据上面得到的commonjs代码是在function函数环境执行的结论, 那就是执行commonjs代码的这个函数在执行时使用call或者apply将this指向了export或者说module.exports

3. commonjs模块导出的到底是什么内容呢?

exports = {
    a: 1
}

module.exports = {
    b: 2
}

this.a = {
    c: 3
}

const test = require('./common-test');

console.log(test); // { b: 2 }

如上所示可以得到commonjs真正导出的是module.exports的代码