文章目录
- 作用域
- 变量的作用域和生命周期
- JS 的两种作用域:全局作用域和函数作用域
- 作用域内定义的变量,函数声明会提高到作用域的顶部(同一个作用域)
- 全局对象
- 构造函数
作用域
变量的作用域和生命周期
作用域
作用域:程序设计概念,通常来说,一段程序代码所用到的名字并不总是有效的或可用的
而限于这个名字的可用性的代码范围是这个名字的作用域
- 局部变量的作用域是变量所在的局部范围
- 全局变量的作用域是整个工程
生命周期
变量的生命周期指的是变量的创建到变量的周期的销毁之间的一个时间段
- 局部变量的生命周期是:进入作用域生命周期开始,出作用域生命周期结束
- 全局变量的生命周期是:整个程序的生命周期
JS 的两种作用域:全局作用域和函数作用域
- 内部的作用域能访问外部,反之不行,访问时从内向外那一次查找
- 如果在内部的作用域中访问了外部,则就会产生闭包
- 内部作用域能访问的外部,取决于函数的定义的位置,和调用无关
函数嵌套是一层一层像外找,与调用不同
作用域内定义的变量,函数声明会提高到作用域的顶部(同一个作用域)
var a=1;
function m()
{
a++;
}
function m2 (){
var a=3;
m();
console.log(a);
}
m2();
console.log(a);
//面试题
// 1.
// console.log(a,b,c);
// var a=1;
// var b=function(){};
// function c(){};
2.
var a=1,b=2;
function m1(){
console.log(a);
var a=3;
function m2 (){
console.log(a,b);
}
m2();
}
m1();
所有的全局变量,全局函数都会附加到全局对象
这就称为全局污染,可以利用执行函数来避免这种情况
全局对象
无论是浏览器环境,还是node环境,都会提供一个全局对象
- 浏览器环境:window
- node环境:global
全局对象有下面几个特点:
- 全局对象的属性可以被直接访问
- 给未声明的变量赋值,实际就是给全局对象的属性赋值
永远别这么干
- 所有的全局变量、全局函数都会附加到全局对象
这称之为全局污染,又称之为全局暴露,或简称污染、暴露
如果要避免污染,需要使用立即执行函数改变其作用域
立即执行函数又称之为IIFE,它的全称是Immediately Invoked Function Expression
IIFE通常用于强行改变作用域
/*
var a=1;
var b=2;
暴露为sayhi
function hello(){
console.log('hello World');
}
暴露为counter
var counter=1;
*/
var xiaochen=(function (){
var a = 1;
var b = 2;
var counter = 1;
function hello(){
console.log('hello World');
}
return {
counter:counter,
sayhi:hello
};
}
)();
/*
var a = 3;
var b = 4;
使用1.js暴露的函数和变量
*/
(function (){
var a = 3;
var b = 4;
xiaochen.sayhi();
console.log(xiaochen.counter);
} )();
构造函数
/*
var person={
firstName:'chen',
lastName:'ying',
sayHi:function(){
console.log('我的名字叫做:' + person.fullName);
}
}
person.fullName =person.firstName + person.lastName;
person.sayHi();*/
function CreatPerson(firstName,lastName){
var obj={
firstName:firstName,
lastName:lastName,
};
obj.fullName = obj.firstName + obj.lastName;
obj.sayHi = function(){
console.log('我的名字叫做:' + obj.fullName);
}
return obj;
}
var person1 = CreatPerson('小','刘');
person1.sayHi();
var person2 = CreatPerson('小','陈');
person2.sayHi();
function Person(firstName,lastName){
this.firstName = firstName,
this.lastName = lastName,
this.fullName = this.firstName + this.lastName;
this.sayHi = function(){
console.log('我的名字叫做:' + this.fullName)
}
return obj;
}
var person1 = new Person ('小','陈');
person1.sayHi();