JavaScript上下文

"this" 上下文

上下文通常是取决于一个函数如何被调用。当函数作为对象的方法被调用时,this 被设置为调用方法的对象:

var object = {
    foo: function(){
        alert(this === object);
    }
};
object.foo(); // true

同样的原理适用于当调用一个函数时通过new的操作符创建一个对象的实例。当以这种方式调用时,this 的值将被设置为新创建的实例:

function foo(){
    alert(this);
}
foo() // window
new foo() // foo

当调用一个未绑定函数,this 将被默认设置为 全局上下文(global context) 或window对象(如果在浏览器中)。然而如果函数在严格模式下被执行("use strict"),this的值将被默认设置为undefined。 
执行上下文和作用域链

javascript是一个单线程语言,这意味着在浏览器中同时只能做一件事情。当javascript解释器初始执行代码,它首先默认竟如全局上下文。每次调用一个函数将会创建一个新的执行上下文。

这里经常发生混淆,这术语”执行上下文(execution context)“在这里的所要表达的意思是作用域,不是前面讨论的上下文。这是槽糕的命名,然而这术语ECMAScript规范所定义的,无奈的遵守吧。

每次新创建一个执行上下文,会被添加到作用域链的顶部,又是也成为执行或调用栈。浏览器总是运行在位于作用域链顶部当前执行上下文。一旦完成,它(当前执行上下文)将从栈顶被移除并且将控制权归还给之前的执行上下文。例如:

function first(){
    second();
    function second(){
        third();
        function third(){
            fourth();
            function fourth(){
                // do something
            }
        }
    }
}
first();

运行前面的代码将会导致嵌套的函数被从上倒下执行直到 fourth 函数,此时作用域链从上到下为: fourth, third, second, first, global。fourth 函数能够访问全局变量和任何在first,second和third函数中定义的变量,就如同访问自己的变量一样。一旦fourth函数执行完成,fourth晕高兴上下文将被从作用域链顶端移除并且执行将返回到thrid函数。这一过程持续进行直到所有代码已完成执行。

不同执行上下文之间的变量命名冲突通过攀爬作用域链解决,从局部直到全局。这意味着具有相同名称的局部变量在作用域链中有更高的优先级。

简单的说,每次你试图访问函数执行上下文中的变量时,查找进程总是从自己的变量对象开始。如果在自己的变量对象中没发现要查找的变量,继续搜索作用域链。它将攀爬作用域链检查每一个执行上下文的变量对象去寻找和变量名称匹配的值。   

时间: 2024-08-29 05:57:08

JavaScript上下文的相关文章

图解JavaScript上下文与作用域

来自:rainy.im 链接:http://blog.rainy.im/2015/07/04/scope-chain-and-prototype-chain-in-js/ 本文尝试阐述Javascript中的上下文与作用域背后的机制,主要涉及到执行上下文(execution context).作用域链(scope chain).闭包(closure).this等概念. Execution context 执行上下文(简称上下文)决定了Js执行过程中可以获取哪些变量.函数.数据,一段程序可能被分割

UIWebView 获取当前的javascript上下文,并js,oc互调

OC调用UIWebView 中的js,网上例子很多,最常用的是UIWebView自带的一个方法: - (NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script; UIWebView 中的js 掉用本地的oc方法: 通过UIWebView开始加载请求的代理方法中,去解析OC跟js约定好的协议(比如约定协议objtc://) 比如<a href="objtc://function">调用oc<

javascript执行上下文

javascript上下文应该算是js这门语言基础中的基础,如果理解了它,就能比较清晰地理解js语句执行的流程,更好地分析代码. 上下文分类: 1)全局级别的上下文  2)函数级别的上下文  3)eval函数内运行的上下文 执行上下文堆栈 在<javascript高级程序设计>中,上下文被称为执行环境,其实表达的都是同一个东西. 在浏览器中,javascript引擎的工作方式是单线程的.也就是说,某一时刻只有唯一的一个事件是被激活处理的,其它的事件被放入队列中,等待被处理. 我们已经知道,当j

图解Javascript原型链

本文尝试阐述Js中原型(prototype).原型链(prototype chain)等概念及其作用机制.上一篇文章(图解Javascript上下文与作用域)介绍了Js中变量作用域的相关概念,实际上关注的一个核心问题是:“在执行当前这行代码时Js解释器可以获取哪些变量”,而原型与原型链实际上还是关于这一问题. 我们知道,在Js中一切皆为对象(Object),但是Js中并没有类(class):Js是基于原型(prototype-based)来实现的面向对象(OOP)的编程范式的,但并不是所有的对象

轻松学习JavaScript二十二:DOM编程学习之节点操作

DOM编程不仅仅可以查找三种节点,也可以操作节点,那就是创建,插入,删除,替换和复制节点.先来看节点 操作方法: 还是借用一贯的HTML代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.

我觉得有意思的JavaScript题目(01-05更新中)

对于以下js题目均来至于网络中.有的来至于文章之中,有的也许来至于问答题型中. 如果你有更好的问题解释,请留言交流! 1.相关问题描述:到底该怎么去理解闭包? 代码片段A: !function(){ var num=1; var exp={}; functionadd(num){ return num++; } exp.getAddNum=function(){ return add(num); } window.a=exp; }() console.log(a.getAddNum()); //

第十一章:WEB浏览器中的javascript

客户端javascript涵盖在本系列的第二部分第10章,主要讲解javascript是如何在web浏览器中实现的,这些章节介绍了大量的脚本宿主对象,这些对象可以表示浏览器窗口.文档树的内容.这些章节同样涵盖重要的web应用所需要的网络编程API.本地存储和检索数据.画图等.主要包含内容有以下章节: web浏览器中的javascript / window对象 /  脚本化文档 /  脚本化css / 事件处理 / 校本化http / jQuery类库 / 客户端存储  /  多媒体和图形编程 /

JavaScript之DOM编程

今天看了web 前端的一些知识,JavaScript的DOM编程笔记如下: 1. 节点及其类型: 1). 元素节点 2). 属性节点: 元素的属性, 可以直接通过属性的方式来操作. 3). 文本节点: 是元素节点的子节点, 其内容为文本. 2. 在 html 文档的什么位置编写 js 代码? 0). 直接在 html 页面中书写代码. <button id="button" onclick="alert('hello world');">Click Me

【JavaScript】JavaScript DOM 编程

在开发的时候,最主要是对DOM进行操作.DOM:Document Object Model 文本对象模型.DOM可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构. DOM是针对xml(HTML)的基于树的API. DOM树:表示的是节点的层次,如下图: DOM节点及其类型:HTML文档中的所有的内容都是节点. 元素节点:每一个HTML元素是一个元素节点. 属性节点:元素的属性,属性节点,可以直接通过属性的方式来操作. 文本节点:是元素节点的子节点,其内容为文本. 例:<li id