`
步青龙
  • 浏览: 297690 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
博客专栏
72ba33fb-eefe-3de1-bd65-82a6e579265d
Java面试
浏览量:0
社区版块
存档分类
最新评论

Javascript 作用域与this的用法

 
阅读更多

1 现象

<SCRIPT LANGUAGE="JavaScript">
	var list=[1,2,3];
	function show(){
		document.write("list :"+list+"</br>");
		if(typeof list=="undefined"){
			var list = [1];
			// alert("Function show:"+list.length);
			document.write("Function show:"+list.length+"</br>");
			document.write("this list:"+this.list.length+"</br>");
			document.write(this.list===window.list);//  true
		}
	}
	show();
</SCRIPT>
 

运行结果:

 list :undefined
 Function show:1
 this list:3
 true

2分析

首先Global对象的中创建list数组,这个list在浏览器里面的宿主环境也就是window对象。 从运行结果我们看到函数show() 里面的list对象添加到了函数环境,而不能说是覆盖,因为window.list依然没变,全局环境的Global有自己的list对象,函数只是他的属性或者方法,函数里的list对象与Global的对象不同。调用show() 是在全局环境调用即是window环境,所以show()方法里面的this指向的是window.

3 脚本引擎的活动

在请求调用一个函数的时候,脚本引擎会先出场,然后再去调用脚本引擎的代码。脚本引擎到底做了什么事情呢。运行结果我们看到 list :undefined 而经过前面分析  list 不是window的对象。先这一段代码

<SCRIPT LANGUAGE="JavaScript">
	function show(){
		document.write("list :"+list+"</br>");
		if(true){
			var list = [1];
		}
		document.write("list:"+list.length+"</br>");
	}
	show();
</SCRIPT>

 结果:

list :undefined
list:1

这里看到list.length 并没有声明在一块,却可以访问,这是Javascript引擎做的事情。引擎首先给函数环境添加list变量。 指向undefined。

引擎处理的代码是:

<SCRIPT LANGUAGE="JavaScript">
	function show(){
		var list;
		document.write("list :"+list+"</br>");
		if(true){
			list = [1];
		}
		document.write("list:"+list.length+"</br>");
	}
	show();
</SCRIPT>
 

脚本引擎总是把声明放在函数的最前面。最后才是真正的执行函数。

过程:请求执行函数-->脚本引擎做一些事情-->执行函数

Javascript是有作用域的,但是与Java的作用域不同,Java的作用域都是在一个代码块里面起作用,Javascript只不过不是块作用域。<Javascript高级程序设计>一书称为环境作用域(全局环境作用域和函数环境作用域)

Javascript不是块作用域类型:

<SCRIPT LANGUAGE="JavaScript">
	function show(){
		document.write("list :"+list+"</br>");
		if(true){
			if (true) {
				if (true) {
					var list = [1];
				};
			};
		}
		document.write("list:"+list.length+"</br>");
	}
	show();
</SCRIPT>

 3 this

  想知道this是什么,只需要知道谁在调用它即可,谁调用它,他就是谁。对于原型链也是一样的,只不过它的prototype指针指向一层一层的向上找(搜索机制)。

 

 

 

 

 

 

分享到:
评论

相关推荐

    Javascript的this用法

    ### JavaScript中的`this`用法详解 在JavaScript中,`this`关键字的使用十分常见,但也是最容易引起混淆的部分之一。正确理解`this`的工作原理对于编写高效、可靠的代码至关重要。本文将深入探讨`this`在不同上下...

    javascript 中关于 this 的用法.zip

    本篇将深入探讨JavaScript中的this用法,帮助你更好地掌握这个核心概念。 1. **函数调用方式与this绑定** - **默认绑定**:在全局环境中,this被绑定到全局对象,在浏览器中通常是window。例如: ```javascript ...

    JavaScript:函数与作用域

    ### JavaScript:函数与作用域 #### 一、函数基础 **1.1 函数声明与表达式** ...以上就是关于JavaScript中的函数与作用域的基本概念和用法。理解这些基本概念对于编写高效可靠的JavaScript程序至关重要。

    javascript 中 this 的用法.docx

    ### JavaScript 中 `this` 的用法...在全局作用域和箭头函数中,`this` 的值取决于外层作用域的 `this` 值。掌握 `this` 的用法有助于开发者更好地理解 JavaScript 中的函数调用机制,进而编写出更加健壮和灵活的代码。

    详解JavaScript中this关键字的用法_.docx

    当函数在全局作用域中被调用时,`this`通常引用的是全局对象,在浏览器环境中就是`window`对象。例如: ```javascript function fn1() { console.log(this); // 输出全局对象,通常是window } fn1(); ``` 2....

    javascript中的this作用域详解

    在JavaScript中,`this`关键字的作用域和指向是理解JavaScript面向对象编程的关键概念之一。`this`的值并不像其他一些编程语言中的对象引用那样固定,而是根据其执行上下文动态确定。下面是针对不同场景下`this`的...

    JavaScript作用域、闭包、对象与原型链概念及用法实例总结

    JavaScript是Web开发中不可或缺的一部分,它提供了丰富的特性,如作用域、闭包、对象和原型链,这些都是理解和编写高效代码的关键。以下是对这些概念的详细解释: 1. **JavaScript变量作用域** - **函数作用域**:...

    JavaScript程序设计javascript中this

    1. 全局作用域与函数作用域 在全局作用域中,`this`通常指向全局对象。在浏览器环境下,这个全局对象是`window`,而在Node.js中,全局对象是`global`。例如: ```javascript var globalVar = "Hello"; function ...

    this的用法以及改变this指向

    箭头函数不会创建自己的`this`上下文,因此它可以继承外层作用域的`this`值。例如: ```javascript var obj = { name: 'objName', getName: function() { setTimeout(() =&gt; { console.log(this.name); // 输出: ...

    JavaScript中this关键字使用方法详解

    在本文中,我们将深入探讨`this`在JavaScript中的工作原理,以及在不同场景下的用法。 1. **函数调用方式** 在函数调用中,`this`的值取决于函数被调用的方式。如果函数是作为对象的方法调用,`this`将指向调用该...

    Javascript的this详解

    - **箭头函数**:箭头函数不创建自己的`this`上下文,它继承自外层(父)作用域的`this`值。 - **事件处理程序**:在DOM事件处理程序中,`this`通常绑定到触发事件的元素。 - **异步回调**:在回调函数或Promise链中...

    Javascript原型对象、this的5钟用法、原型继承、Caller和Callee的使用.docx

    总结来说,理解JavaScript中的原型对象、this用法、原型继承和Caller/Callee对于编写高效、可维护的代码至关重要。这些概念构成了JavaScript面向对象编程的基础,帮助开发者实现对象间的关联和复用,以及创建复杂的...

    JavaScript this使用方法图解

    1. **全局作用域与浏览器环境**: 在浏览器环境中,如果`this`在全局作用域中被引用,它通常会指向`window`对象。在Node.js环境下,`this`则默认指向`global`对象。 2. **函数调用**: 当函数被直接调用时,如`...

    js对象定义及this用法1

    在全局作用域或函数内部,`this`通常指向全局对象(在浏览器环境中是`window`对象)。 理解JavaScript中的对象定义和`this`关键字是成为熟练的JavaScript开发者的基石。它们是实现面向对象编程、封装和继承的基础...

    JavaScript中this的使用

    - **全局或函数外部**:在全局作用域中,`this`指向`window`对象(在浏览器环境中)或全局对象(在Node.js中)。 - **对象方法**:当函数作为对象的一个方法被调用时,`this`指向调用该方法的对象。 - **构造函数...

    javascript中eval和with用法实例总结.docx

    ### JavaScript中的`eval`与`with`用法详解 #### 一、`eval`函数 ##### 1. 定义 `eval`是JavaScript中一个非常强大的内置函数,它可以将字符串解析并执行为JavaScript代码。这使得开发者能够在运行时动态地创建和...

    javascript面向对象之this关键词用法分析

    本文将分析this关键词在JavaScript面向对象中的用法,通过实例来展示在不同场合下this的特性及使用技巧。 首先,理解this在全局作用域中的含义是非常重要的。在全局作用域中,无论是否在严格模式下,this通常指向...

Global site tag (gtag.js) - Google Analytics