如何从函数/实例外部访问变量

how to access a variable from outside a function/instance

本文关键字:外部 访问 变量 实例 函数      更新时间:2023-09-26

我有这个非常简单的JavaScript代码,它应该使用参数返回全名firstnamelastname当我在函数中提醒全名时,一切都可以正常工作。但是我正在努力如何使fullname变量从函数/实例外部访问?

这是我的代码:

var getName = function () {
    this.name = function (firstname, lastname, success) {
        var fullName = firstname + " " + lastname;
        success(fullName);
    };
};

var test = new getName();
test.name("John", "Smith", function (output) {
    var fullname = output;
    alert(fullname); //this works fine
    return fullname; // I need this variable to be accessed from outside this function
});
var myName = fullname; //I need to create the variable here
alert(myName); //this does not work

这是小提琴

非常感谢您的帮助。

编辑:我正在构建一个iPad应用程序,我正在使用cordova和javascript插件。其中一个插件使我可以访问设备中的文件。现在,我需要能够获取路径并在回调之外使用它,以便我可以在作用域中的任何位置使用:

这是插件代码:

var FileManager = function(){
this.get_path = function(todir,tofilename, success){
        fail = (typeof fail == 'undefined')? Log('FileManager','read file fail'): fail;
        this.load_file(
            todir,
            tofilename,
            function(fileEntry){
                var sPath = fileEntry.toURL();
                success(sPath);
            },
            Log('fail')
        );
    }

    this.load_file = function(dir, file, success, fail, dont_repeat){
        if(!dir || dir =='')
        {
            Log('error','msg')('No file should be created, without a folder, to prevent a mess');
            fail();
            return;
        }
        fail = (typeof fail == 'undefined')? Log('FileManager','load file fail'): fail;
        var full_file_path = dir+'/'+file;
        var object = this;
        // get fileSystem
        fileSystemSingleton.load(
            function(fs){
                var dont_repeat_inner = dont_repeat;
                // get file handler
                console.log(fs.root);
                fs.root.getFile(
                    full_file_path,
                    {create: true, exclusive: false},
                    success,
                    function(error){
                        if(dont_repeat == true){
                            Log('FileManager','error')('recurring error, gettingout of here!');
                            return;
                        }
                        // if target folder does not exist, create it
                        if(error.code == 3){
                            Log('FileManager','msg')('folder does not exist, creating it');
                            var a = new DirManager();
                            a.create_r(
                                dir,
                                function(){
                                    Log('FileManager','mesg')('trying to create the file again: '+file);
                                    object.load_file(dir,file,success,fail,true);
                                },
                                fail
                            );
                            return;
                        }
                        fail(error);
                    }
                );
            }
        );
    };
}

这是我如何使用它:

    var b = new FileManager(); // Initialize a File manager
    b.get_path('Documents','data.json',function(path){
        myPath = path;
        console.log(myPath); //this gives me the path of the file in the console, which works fine
        return myPath; //I return the path to be accessed outside
    });
    var filePath = myPath; //here I need to access the path variable
    console.log(filePath)// here, the path is undefined and it does not work
    //Since I'm using angular services to retrieve the data from json, I'd like to pass the filePath
  //this is a fraction of code for retrieving data:
  return $resource('data.json',{}, {'query': {method: 'GET', isArray: false}});
  //passing the value does not work
  return $resource(filePath,{}, {'query': {method: 'GET', isArray: false}});
  //even wrapping resource around instance does not work, it breaks the whole app
  b.get_path('Documents','data.json',function(path){
        myPath = path;
        console.log(myPath); //this gives me the path of the file in the console, which works fine
        return $resource(myPath,{}, {'query': {method: 'GET', isArray: false}});
    });

工厂服务:

'use strict';
angular
    .module ('myApp')
    .factory('getMeData', function ($resource) {
        var b = new FileManager(); // Initialize a File manager
        b.get_path('Documents','data.json',function(path){
            myPath = path;
            return myPath;
        });
        //below doesn't work when passing path (it is undefined)
        return $resource(myPath,{}, {'query': {method: 'GET', isArray: false}});
        //when wrapping it around, the app crashes
        b.get_path('Documents','data.json',function(path){
            myPath = path;
            return $resource(myPath,{}, {'query': {method: 'GET', isArray: false}});
        });
        //none of the solution above work
    });

如果你让 name 函数返回 success 的结果,那么你可以使用该方法的返回。

var getName = function () {
    this.name = function (firstname, lastname, success) {
        var fullName = firstname + " " + lastname;
        return success(fullName);
    };
};

var test = new getName();
var myName = test.name("John", "Smith", function (output) {
    var fullname = output;
    alert(fullname); //this works fine
    return fullname; // I need this variable to be accessed from outside this function
});
alert(myName);

在回调之外定义fullname

var getName = function () {
    this.name = function (firstname, lastname, success) {
        var fullName = firstname + " " + lastname;
        success(fullName);
    };
};

var test = new getName();
var fullname;
test.name("John", "Smith", function (output) {
    fullname = output;
    alert(fullname); //this works fine
    return fullname; // I need this variable to be accessed from outside this function
});
alert(fullname);

希望对您有所帮助。小提琴

如果需要异步:

假设代码的实际源代码是异步的,现在从您的注释中确认,您应该简单地在回调中处理结果。该值在回调之外根本不可用,因为结果稍后到达。

@Jim和@bestmike007的答案不适用于异步操作,因为它从回调内部返回一个值,该回调可能在函数运行后很长时间内发生。(注意:@bestmike007确实在评论中链接了改进的答案)。

例如,看看这里发生了什么:http://fiddle.jshell.net/y1m36w9p/1/或这里 http://jsfiddle.net/TrueBlueAussie/opczeuqw/1/

使用异步代码的唯一方法是以异步方式。这意味着您只能在回调中处理结果:

// Get the fullname asyc and process the result
test.name("John", "Smith", function (fullname) {
    alert(fullname); // you can only work with the result in here
});

另一种方法是从 getName.name() 返回 jQuery promise,但最终结果仍然是回调来完成工作,但这次它看起来像这样:

test.name("John", "Smith").done(function(fullname){
    alert(fullname); // you can only work with the result in here
});

但这是更多的代码和复杂性,目前没有额外的好处。

对于特定的更新示例代码:

我对 Angular 不够熟悉,无法确认这一点,并且需要查看如何调用getMeData,但您应该使用另一个回调作为您注册的getMeData函数的参数:

'use strict';
angular
    .module ('myApp')
    .factory('getMeData', function ($resource, callback) {
        var b = new FileManager(); // Initialize a File manager
        b.get_path('Documents','data.json',function(path){
            callback($resource(path,{}, {'query': {method: 'GET', isArray: false}}));
        });
    });

如果不需要异步(过时选项)

如果(正如下面之前相互矛盾的评论所说)这并不意味着异步,那么根本不要使用回调,只是返回值的简单函数/方法:http://fiddle.jshell.net/y1m36w9p/2/

例如

var getName = function () {
    this.name = function (firstname, lastname) {
        return firstname + " " + lastname;
    };
};
// Create a instance of the getName class
var test = new getName();
// Get the fullname asyc and process the result
var fullname = test.name("John", "Smith");
// Do what you like with the value returned from the function
alert(fullname);