Dojo中dojo/_base/lang模块的hitch函数

前言

首先在我的另一篇博文中写了有关hitch函数的讲解,这里写一些自己的理解。

1. 变量作用域

首先在JavaScript的函数与其他面向对象的语言如C#中的方法重要的区别就是JavaScript函数可以运行在不同的上下文中。在C#中方法前面使用this关键字表示该类的实例,而在JavaScript中,指的是函数运行的上下文。比如JavaScript的闭包中,JavaScript文件内部声明的函数可以使用this访问文件中的任何变量,但是在对象中,声明的函数中使用this,只能引用对象内部的变量,除非提供其他上下文。
由于我们经常使用封闭的函数作为Dojo函数的参数,Dojo提供了hitch函数用来设置上下文,方便了开发。

2. 例子


<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>hitch函数title>
<script type="text/javascript">
        var globalVar="globalvar";
        function accessGlobalVar() {
//            在这里可以访问到全局变量例如上面声明的变量
            console.log(globalVar);
        }
        var myFunction={
            closeVar:"closrvar",
            closeFunc:function () {
//                显示全局上下文变量
               console.log(this.globalVar); 
//               显示闭包上下文变量
                console.log(this.closeVar);
            }
        };
//        调用accessGlobalVar函数
        accessGlobalVar();
//        调用字面量对象中的函数
        myFunction.closeFunc();
    script>
head>
<body>
body>
html>

运行之后的结果:
Dojo中dojo/_base/lang模块的hitch函数_第1张图片
首先我们定义了一个全局变量 globalVar,在一个对象中声明了一个变量 closeVar。通过函数accessGlobalVar可以访问到全局变量,字面量对象中的closeFunc函数只能访问closeVar,不能访问全局变量,因此可以看到运行的结果,在控制台打印出undefined。

3. 使用hitch函数

怎么可以解决上面的问题,使其字面量对象中的closeFunc函数也能访问到全局变量中的函数,可以使用Dojo模块中的hitch函数。使用hitch函数可以将closeFunc函数连接到全局上下文,但是却不能访问内部的closeVar变量了,这是因为它不是在运行closeFunc函数的上下文中了。
代码:


<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>hitch函数title>
    <script src="dojo/dojo/dojo.js">script>
    <link rel="stylesheet" href="dojo/dijit/themes/claro/claro.css">
    <script type="text/javascript">
        var globalVar="globalvar";
        function accessGlobalVar() {
//            在这里可以访问到全局变量例如上面声明的变量
            console.log(globalVar);
        }
        var myFunction={
            closeVar:"closrvar",
            closeFunc:function () {
//                显示全局上下文变量
               console.log(this.globalVar);
//               显示闭包上下文变量
                console.log(this.closeVar);
            }
        };
//        调用accessGlobalVar函数
        accessGlobalVar();
//        调用字面量对象中的函数
        myFunction.closeFunc();
        require(["dojo/_base/lang"],function (lang) {
            var switchContent=lang.hitch(myFunction.closeFunc);
            switchContent();
        });
    script>
head>
<body>
body>
html>

打开控制台可以看到如下结果:
Dojo中dojo/_base/lang模块的hitch函数_第2张图片

你可能感兴趣的:(webgis,杂谈,arcgis,api,for,javascript)