JS中作用域以及变量范围分析

2024-12-02 23:36:42

变量作用域

js作为一门脚本语言，他与c，java这些语言是不相同的。

全局变量

在js中声明全局变量，有下面几种方式：

1.在函数外通过var来声明。

var test ="hello";
console.log(test);
function a(){
  test="xx";
  console.log(test);
}
a();
console.log(test);

结果：

hello
xx
xx

这种方式通过声明的变量在任何地方都可进行修改和使用。

2.在函数中隐士的声明变量

function a(){
  test=22;
  console.log(test);
}
a();
console.log(test);

结果：

22
22

因为js是弱类型脚本语言，在使用之前无需定义，所以可以通过这种方式也能声明全局变量。

来看一个反例：

var test="aa";
console.log(test);
function a(test){
  test=22;
  console.log(test);
}
a(test);
console.log(test);

结果：

aa
22
aa

可以看到在函数中修改了test值可是第二次在函数外打印的值没有变。这是因为在函数的过程中只是进行了值传递。局部变量覆盖掉了全局变量，只是局部变量在修改。

因为在函数的参数内定义的变量并不是全局变量。

反例二：

function a(){
  var test="aa";
  console.log(test);
}
a();
console.log(test);

结果

aa
notdefine

在函数内通过var来声明的变量是局部变量，函数外无法访问。

变量作用域

js的作用域和c与java这些语言的作用域也不相同，骚小孩在以前经常会因为这个而头疼，后来在认真学习了以后才懂了。

1.js中没有块范围。

if(1!=1){
  var y=c;
}
console.log(y)

if(1==1){
  var x=a;
}
console.log(x);

结果：

undefine
a

可以看到在if代码块定义的两个变量，在if块之外去打印，如果判断成功的话，才会去执行里边的声明语句，声明语句执行了，那么在代码块外边就可访问到了。

也可以看出在代码块中声明的变量也是全局变量。

2.js中的全局变量都会成为window的属性

var x=0;
console.log(window.x);

结果：

0

3.变量提升

var c=0;
function a(){
  console.log(c);
}
a();

结果：

0

var c=0;
function a(){
  console.log(c);
  var c=11;
}
a();

结果：

undefine

可以看出在函数中加了一行声明语句结果就会不同，这产生这样的原因是什么呢？

其实第二个代码块的执行顺序是这样的：

var c=0;
function a(){
  var c;
  console.log(c);
  c=11;
}
a();

在函数中他会先把声明语句提升到第一行，但是并不提升赋值。然后局部变量覆盖全局变量，在打印c的时候局部变量还没来的

及赋值所以就是undefine。

变量提升不只会提升会执行的变量，不会执行的变量也会进行提升：

var c=10;
function a(){
  console.log(c);
  if(false) {
    var c = 10;
  }
}
a();

结果：

undefine

因为在if判断中定义了局部变量c，虽然if条件不成立，但是也会进行变量提升，所以打印c也是undefine；

4.let变量

通过上面的例子可以看到用var来定义变量的弊端：

1.var定义的变量没有块作用域；

2.var定义的全局变量会自动添加全局window对象的属性；

3.var变量会提前装载（变量提升）；

let就是为了解决这些问题而诞生的。

for(let i=0;i<5;i++){

}
console.log(i);

结果：

报错

在代码块中定义了let变量，在外部引用的时候不会存在。即存在块作用域。

let i=10;
console.log(window.i);

结果：

undefine

let声明的变量并不会成为window的属性。

var c=10;
function a(){
  console.log(c);
  let c=1;
  console.log(c);
}
a();

在函数中存在变量与全局变量名相同的c，因此会覆盖掉全局变量c，但是由于let不会提前装载，所以在第一个打印语句打印c时会报错。

到此这篇关于JS中作用域以及变量范围分析的文章就介绍到这了,更多相关JS变量作用域内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

JS中的变量作用域(console版)

作用域说明:指一个变量的作用范围 1.全局作用域 (1) 全局作用域在页面打开时被创建,页面关闭时被销毁 (2) 编写在script标签中的变量和函数,作用域为全局,在页面的任意位置都可以访问到 (3) 在全局作用域中有全局对象window,代表一个浏览器窗口,由浏览器创建,可以直接调用 (4) 全局作用域中声明的变量和函数会作为window对象的属性和方法保存 var a = 10; b = 20; function an(){ console.log('an') } var bn = fun
javascript 的变量、作用域和内存问题

javascript 的变量.作用域和内存问题 (一)JavaScript变量可以用来保存两种类型的值:基本类型值和引用类型值.基本类型的值源自以下5种基本数据类型:Undefined.Null.Boolean.Number和 String.基本类型值和引用类型值具有以下特点: 1.基本类型值在内存中占据固定大小的空间,因此被保存在栈内存中: 2.从一个变量向另一个变量复制基本类型的值,会创建这个值的一个副本: 3.引用类型的值是对象,保存在堆内存中: 4.包含引用类型值的变量实际上包含的并不是
JS块级作用域和私有变量实例分析

本文实例讲述了JS块级作用域和私有变量.分享给大家供大家参考,具体如下: 块级作用域 (function(){ //这里是块级作用域 })() 例如: (function(){ for(var i=0;i<5;i++){ alert(i);//0,1,2,3,4 } })(); alert(i);//error 上例中,定义了一个块级作用域,变量i在块级作用域中可见的,但是在块级作用域外部则无法访问. 这种技术经常在全局作用域中被用在函数外部,从而限制向全局作用域中添加过多的变量和函数. 私有变
js变量以及其作用域详解

一.变量的类型 Javascript和Java.C这些语言不同,它是一种无类型.弱检测的语言.它对变量的定义并不需要声明变量类型,我们只要通过赋值的形式,可以将各种类型的数据赋值给同一个变量.例如: 复制代码代码如下: i=100;//Number类型 i="variable";//String类型 i={x:4};//Object类型 i=[1,2,3];//Array类型 JS的这种特性虽然让我们的编码更加灵活,但也带来了一个弊端,不利于Debug,编译器的弱检测让我们维护冗长的
js 作用域和变量详解

一.说起变量的提升呢,首先我们先看一段简单的代码 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <script> var v = 'hello world'; alert(v); </script&
JavaScript的变量作用域深入理解

在学习JavaScript的变量作用域之前,我们应当明确几点: a.JavaScript的变量作用域是基于其特有的作用域链的. b.JavaScript没有块级作用域. c.函数中声明的变量在整个函数中都有定义. 1.JavaScript的作用域链首先看下下面这段代码: 复制代码代码如下: <script type="text/javascript" language="javascript"> var rain = 1; function rain
Angularjs全局变量被作用域监听的正确姿势

如果你只想知道结论: $scope.$watch($rootScope.xxx,function(newVal,oldVal){ //do something }) 马上就有人问为什么不是: $rootScope.$watch("xxx",function(newVal,oldVal){ //do something }) 从我最近的一个bug来说说为什么要用第一种方式. 逻辑如图,一开始我使用了 $rootScope.$watch 的写法.因为 angularjs 在 $rootSc
JavaScript变量类型以及变量作用域详解

变量类型 ECMAScript变量可能包含两种不同类型的数据值:基本类型和引用类型. 基本类型基本类型指的是简单的数据段,5种基本数据类型:undefined.null.boolean.number.string,基本数据类型是按值访问的,因此可以操作保存在变量中的实际的值. 复制变量值从一个变量向另一个变量复制基本类型的值,会在变量对象上创建一个新值,然后把该值复制到为新变量分配的位置上.例如: var num1 = 5; var num2 = num1; 复制前的变量对象复制后的变量对
JS中作用域和变量提升(hoisting)的深入理解

作用域(Scoping) 对于Javascript初学者来说,一个最迷惑的地方就是作用域:事实上,不光是初学者.我就见过一些有经验的javascript程序员,但他们对scope理解不深.javascript作用域之所以迷惑,是因为它程序语法本身长的像C家族的语言.我对作用域的理解是只会对某个范围产生作用,而不会对外产生影响的封闭空间.在这样的一些空间里,外部不能访问内部变量,但内部可以访问外部变量. c语言的变量分为全局变量和局部变量,全局变量的作用范围是任何文件和函数访问(当然,对于非变量定
关于javascript 回调函数中变量作用域的讨论

1.背景 Javascript中的回调函数,相信大家都不陌生,最明显的例子是做Ajax请求时,提供的回调函数, 实际上DOM节点的事件处理方法(onclick,ondblclick等)也是回调函数. 在使用DWR的时候,回调函数可以作为第一个或者最后一个参数出现,如: JScript code function callBack(result){ } myDwrService.doSomething(param1,param2,callBack);//DWR的推荐方式 //或者 myDwrSer
JS变量及其作用域

1. 变量及其作用域:变量分为"全局变量"和"局部变量","全局变量"申明在函数外部,可供所有函数使用,而"局部变量"申明在函数体内部,只能在定义该变量的函数体内使用. (备注:在申明变量时没有var关键字,而是直接赋值的变量均为全局变量) <script type="text/javascript"> function main() { n = 10;//这里的n为全局变量,可以被外部直接使用
JavaScript变量作用域及内存问题实例分析

本文实例讲述了JavaScript变量作用域及内存问题.分享给大家供大家参考,具体如下: 学习要点: 1.变量及作用域 2.内存问题 JavaScript的变量与其他语言的变量有很大区别.JavaScript变量是松散型的(不强制类型)本质,决定了它只是在特定时间用于保存特定值的一个名字而已.由于不存在定义某个变量必须要保存何种数据类型值的规则,变量的值及其数据类型可以在脚本的生命周期内改变. 一．变量及作用域 1.基本类型和引用类型的值 ECMAScript变量可能包含两种不同的数据类型的值:
深入Javascript函数、递归与闭包(执行环境、变量对象与作用域链)使用详解

函数表达式 1.JavaScript中定义函数有2钟方法: 1-1.函数声明: 复制代码代码如下: function funcName(arg1,arg2,arg3){ //函数体} ①name属性:可读取函数名.非标准,浏览器支持:FF.Chrome.safari.Opera. ②函数声明提升:指执行代码之前会先读取函数声明.即函数调用可置于函数声明之前. 1-2.函数表达式: 复制代码代码如下: var funcName = function(arg1,arg2,arg3){ //函

JS中作用域以及变量范围分析

相关推荐

随机推荐