一、js全局变量的声明 (前端)
- 在全局作用域(window)在下用var/function声明的变量
- 在函数内不使用var声明的变量(作用域链的问题)
- 在函数内用var连续声明多个变量,后面的变量是全局变量(预解释问题)
- 在全局作用域下和私有作用域下直接给全局对象曾加的属性 window.$ = jQuery
- 在全局作用域下用let、const(常量)、class(类)、import(模块)定义的变量
后端: Node里面
1)node里面的玩的是模块,没有全局变量,你在模块里面用let, const都是模块里面的变量, 看是全局变量,其实模块内部都是用一个闭包包起来的,形参了一个新的私有作用域,用exports和moduole.exports导出,放到他们里面,他们是全局的 (JS是函数式编程 <箭头函数>)
;((require, exports, module) =>{
module.exports = {};
exports.a = 1;
exports.b = 2;
}());
复制代码
- node里面定义全局变量,给Global上面加属性和方法
a.js模块里面
Global.a = 1;
Global.getA = () => {
return Global.a;
}
复制代码
-
Node里面的this Node里面没有this,因为没有上下作用域
-
Global和window区别
- global在node最顶层, window是在浏览器里面,所以node里面没有DOM,BOM这些
我们以后再定义变量可以使用let和const了,无需再使用val了
注意:
##### ==>>ES6加入的四个let、const(常量)、class(类)、import
- 1)没有预解释 (必须先声明后使用, 暂时性死区问题)
- 2)不能重复声明, 可以重复赋值 (前提是同一个作用域里面) (函数的形参,不能在进行重复声明了)
- 3)没有挂到window对象上,不污染全局变量
- 4)有块级作用域{} for/while/if问题,变量不暴漏 (for父级作用域,里面子级作用域) var循环的问题, << 闭包印出 >>
- 5)有常量const <基本数据类型不能改值,引用数据类型不能修改引用地址> ***声明 + 赋值必须都完成 (选项卡特效问题,闭包解决,ES6的let解决)
> myglobal = "hello"; // 不推荐写法
> console.log(myglobal); // "hello"
> console.log(window.myglobal); // "hello"
> console.log(window["myglobal"]); // "hello"
> console.log(this.myglobal); // "hello" //==>> 全局作用域下this是window 非严格模式下,严格模式下是undefined
复制代码
eg1:
function fn(val) {
x = 1; //==>> 隐式存在作用域链的问题
return val;
}
fn();
console.log(window.x);
复制代码
eg2
function fn() {
var a = b = c = d =1; //===>> var a = (b = c = d = 0)
}
fn();
console.log(window.b);
console.log(window.c);
cosole.log(window['d']);
复制代码
eg3
function jQuery() {
var jQuery = funciton(){};
window.$ = window.jQuery = jQuyer;
}
jQuery();
$();
复制代码
二、忘记var的副作用
隐式全局变量和明确定义的全局变量间有些小的差异,就是通过delete操作符让变量未定义的能力。
- 通过var创建的全局变量(任何函数之外的程序中创建)是不能被删除的。
- 无var创建的隐式全局变量(无视是否在函数中创建)是能被删除的。
- 标准方式var声明的全局变量,是不可以删除的(deltete)
这表明,在技术上,隐式全局变量并不是真正的全局变量,但它们是全局对象的属性。属性是可以通过delete操作符删除的,而变量是不能的:
// 定义三个全局变量
var global_var = 1;
global_novar = 2; // 反面教材
(function () {
global_fromfunc = 3; // 反面教材
}());
function global_novar4() {
}
// 试图删除
delete global_var; // false
delete global_novar; // true
delete global_fromfunc; // true
delete global_novar4; //false
// 测试该删除
typeof global_var; // "number"
typeof global_novar; // "undefined"
typeof global_fromfunc; // "undefined"
typeof global_novar4; // "function"
复制代码
三: 全局变量的问题
全局变量的问题在于,你的JavaScript应用程序和web页面上的所有代码都共享了这些全局变量,他们住在同一个全局命名空间,所以当程序的两个不同部分定义同名但不同作用的全局变量的时候,命名冲突在所难免。
function sum(x, y) {
result = x + y; //==>> 不推存写法
return result;
}
sum(1, 2);
console.log(result); //==>> 3
复制代码
四: 解决全局变量的问题
- 命令空间(单例模式)
- 面向对象封装(class)
eg1:命名空间进行管理
var tools = {
checkName() {
...
return this;
},
checkEmail() {
...
return this; //==>>链式调用
}
};
tools.totas = {};
tools.ajax = {};
全局唯一一个对象,tools,便于管理,维护,不冲突和其他类库
复制代码
eg2: class进行管理
class Card {
constuctor(name = '一级卡片', id, level = 1) {
this.name = name;
this.id = id;
this.level = level;
}
updateCard(id) {
ajax...
}
deleteCard(id) {
ajax...
}
static typeChane(val) {
...
}
}
复制代码
eg3.块级作用域
块级作用域: {}包起来的, let/const 让JS有了块级作用域
1.
console.log(x); // ==>> undefined
if(true) {
var x = 1;
}
console.log(x); // ==>> 1
window.x;
window['x'];
2.
for(var i=0; i< 10;i++) {
}
console.log(i); //===>> 10
window.i;
window['i']
3.
if (true) {
let a = 1;
}
window.a; //==>> undefined
window['a']; //==> undefined
复制代码
预解释问题:
1.全局作用域预解释
2.只对等号前面进行预解释
3.函数return的代码不执行,但是还要进行预解释
4.不管条件是否成立,都要进行预解释
function fn() {
fn1();
return;
function fn1() {
alert('ok')
}
}
fn();
function fn() {
console.log(a++); //==> NaN
return;
var a = 1;
}
fn();
复制代码