Identify the caller (or how pass parameter) of a callback (JSON) function in JavaScript

Question

When i request

BASE_URL + 'json/valueone?callback=fnCallBack0'

the response from server is treated in a callback function. This function receives (ASYNCHRONOUS) data (JSON format) but do not include the initial parameter "valueone"

var BASE_URL = ...
function fnCallBack(data){
    if (data != null) {
    // HERE...I NEED ID <====================
    // arguments.callee.caller <==================== dont work
        console.log('information', data);
    }
}

// onclick callback function.
function OnClick(info, tab) {
    var arrH = ['valueone', 'valuetwo'];
    arrH.forEach(function(value) {
        var scrCallBack = document.createElement('script');
        scrCallBack.src = BASE_URL + 'json/' + value + '?callback=fnCallBack';
        //BASE_URL + 'json/one?callback=fnCallBack0';
        document.body.appendChild(scrCallBack);
    });

My solution is to create an intermediate function correlative name (fnCallBack0, fnCallBack1, ...), a global array, and a counter. Works fine, but this is not OOP, is a fudge.

var BASE_URL = ...
//global array
var arrH = [];

var fnCallBack0 = function(data){
    fnCallBack(data, '0');
}
var fnCallBack1 = function(data){
    fnCallBack(data, '1');
}

function fnCallBack(data, id){
    if (data != null) {
        console.log('information', data + arrH[id]);
    }
}

// onclick callback function.
function OnClick(info, tab) {
    var i = 0;
    arrH = ['valueone', 'valuetwo'];
    arrH.forEach(function(value) {
        var scrCallBack = document.createElement('script');
        scrCallBack.src = BASE_URL + 'json/' + value + '?callback=fnCallBack' + (i++).toString();
        //BASE_URL + 'json/one?callback=fnCallBack0';
        document.body.appendChild(scrCallBack);
    });
chrome.contextMenus.create({
    title: '%s',
    contexts: ["selection"],
    onclick: function(info) {console.log(info.selectionText)}
});

var idConsole = chrome.contextMenus.create({
    title: 'console',
    contexts: ["selection"],
    onclick: OnClick
});

I tried with inject function as code in html page, but i receeived "inline security error", and a lot of similar questions.

Please, NO AJAX and no jQuery.

This is my first post and my first chrome extension Thanks in advanced.

Answer 1

I don't see how anything of this has to do with OOP, but a solution would be to just create the callback function dynamically so that you can use a closure to pass the correct data:

function fnCallBack(data, value){
    if (data != null) {
        console.log('information', data + value);
    }
}

// onclick callback function.
function OnClick(info, tab) {
    ['valueone', 'valuetwo'].forEach(function(value, index) {
        // unique function name
        var functionName = 'fnCallback' + index + Date.now(); 

        window[functionName] = function(data) {
            fnCallBack(data, value);
            delete window[functionName]; // clean up
        };

        var scrCallBack = document.createElement('script');
        scrCallBack.src = BASE_URL + 'json/' + value + '?callback=' + functionName;
        document.body.appendChild(scrCallBack);
    });
}