javascript - export a variable inside a function to be used in other modules - Stack Overflow

admin管理员组

文章数量:1316399

I'm quite new to programming. I have spent the last 3 days trying to figure out this problem, so any help would be greatly appreciated.

I have access to clientID inside a for loop. (Please look at the last line in the code below). There is only one ClientID which I'm successfully able to print.

I want this client ID to be exported from this module so that I can use it in other modules.

import { Configurations } from './models';

type MethodNames = 'init' | 'event';

export const DEFAULT_NAME = '_hw';

interface LoaderObject { 
    q: Array<[MethodNames, {}]>;
}

export default (
    win: Window,
    defaultConfig: Configurations,
    scriptElement: Element | null,
    render: (element: HTMLElement, config: Configurations) => void
) => {
 
    const instanceName =
        scriptElement?.attributes.getNamedItem('id')?.value ?? DEFAULT_NAME;
    const loaderObject: LoaderObject = win[instanceName];
    if (!loaderObject || !loaderObject.q) {
        throw new Error(
            `Widget didn't find LoaderObject`);
    }

    if (win[`loaded-${instanceName}`]) {
        throw new Error(
            `Widget already loaded`)
        );
    }

    let targetElement: HTMLElement;


    for (let i = 0; i < loaderObject.q.length; i++) {
        const item = loaderObject.q[i];
        const methodName = item[0];
        console.log(methodName);
        if (i === 0 && methodName !== 'init') {
            throw new Error(
                `Failed to start Widget`);
        } else if (i !== 0 && methodName === 'init') {
            continue;
        }
      
        const valueObject = Object.assign(defaultConfig, item[1]);
        const clientID = valueObject.clientID
        console.log("ClientID", clientID)
    }

//rest of the code.... 

I have also tried this. defined a variable clientID outside the for loop and then storing value from inside the for loop. But on printing, I'm getting undefined

var clientID;
console.log("....last Client ID", clientID)

   const valueObject = Object.assign(defaultConfig, item[1]);
    clientID = valueObject.clientID

I'm quite new to programming. I have spent the last 3 days trying to figure out this problem, so any help would be greatly appreciated.

I have access to clientID inside a for loop. (Please look at the last line in the code below). There is only one ClientID which I'm successfully able to print.

I want this client ID to be exported from this module so that I can use it in other modules.

import { Configurations } from './models';

type MethodNames = 'init' | 'event';

export const DEFAULT_NAME = '_hw';

interface LoaderObject { 
    q: Array<[MethodNames, {}]>;
}

export default (
    win: Window,
    defaultConfig: Configurations,
    scriptElement: Element | null,
    render: (element: HTMLElement, config: Configurations) => void
) => {
 
    const instanceName =
        scriptElement?.attributes.getNamedItem('id')?.value ?? DEFAULT_NAME;
    const loaderObject: LoaderObject = win[instanceName];
    if (!loaderObject || !loaderObject.q) {
        throw new Error(
            `Widget didn't find LoaderObject`);
    }

    if (win[`loaded-${instanceName}`]) {
        throw new Error(
            `Widget already loaded`)
        );
    }

    let targetElement: HTMLElement;


    for (let i = 0; i < loaderObject.q.length; i++) {
        const item = loaderObject.q[i];
        const methodName = item[0];
        console.log(methodName);
        if (i === 0 && methodName !== 'init') {
            throw new Error(
                `Failed to start Widget`);
        } else if (i !== 0 && methodName === 'init') {
            continue;
        }
      
        const valueObject = Object.assign(defaultConfig, item[1]);
        const clientID = valueObject.clientID
        console.log("ClientID", clientID)
    }

//rest of the code.... 

I have also tried this. defined a variable clientID outside the for loop and then storing value from inside the for loop. But on printing, I'm getting undefined

var clientID;
console.log("....last Client ID", clientID)

   const valueObject = Object.assign(defaultConfig, item[1]);
    clientID = valueObject.clientID

• javascript

Share Improve this question Follow edited Aug 8, 2023 at 11:20 CommunityBot 111 silver badge asked Feb 7, 2022 at 17:14 Arsene WengerArsene Wenger 65922 gold badges1111 silver badges2727 bronze badges 3

• it seems like every loop iteration, you are generating a new clientID. Maybe you can save each different clientID to an array then export that array ? – Bao Huynh Commented Feb 7, 2022 at 17:33
• @BaoHuynhLam There is only one ClientID and it can be accessed only inside that forloop. How will you export that ClientID variable from inside the function? – Arsene Wenger Commented Feb 7, 2022 at 17:35
• If your clientID variable does not depend on the loop, and as you say, does not change with each loop iteration), maybe you can consider taking it OUT of the for loop. Then you have a variable that you can export – Bao Huynh Commented Feb 7, 2022 at 18:21

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 5

Your issue is about your variables' scopes. Let's start with a simpler version, without for loop:

default export (a: object) => {
    const variableToExport = a;
}

The reason why you can't directly access variableToExport is that it is defined inside the function, and not outside. To deal with it, you have 2 solutions:

1. Assign to a variable in the outer scope.

The code would look like:

/!\ Read the text below before using this snipplet /!\

export let variableToExport;

default export (a: object) => {
    variableToExport = a;
}

Here, you're strictly speaking exporting the variable. Since it's defined outside the function, you can access it outside the function and thus, you can export it. HOWEVER, IT COULD BE A MISTAKE. If you call twice the exported function with different values for a, the variable variableToExport would only have the value corresponding to the second call, and not the first. If the value of variableToExport should not depend on a, it could be OK, but otherwise it seems risky.

2. Returning the value

Since your function would be called to get the variableToExport, you could return it:

default export (a: object) => {
    const variableToExport = a;
    return variableToExport;
}

In case you have multiple things to return, you can build an object to return them all:

default export (a: object) => {
    const retValue = {
        "variableToExport": a,
        ... other variables to return
    }
    return retValue;
}

Then, you can access it from another module (with or without a destructuring assignment):

import foo from 'path/to/module'

const { variableToExport, otherVariable } = foo(a);

This second way is safer than using a "global" variable, as the variableToExport can't have a value that correspond to another call to the function.

---

Now, for the case of your variable in the for loop, you have a similar issue: you can't access to the variable outside the for loop:

default export (bar: array) => {
    for (const elem of bar) {
        const clientID = elem.clientID;
    }
    return clientID; // Nope, clientID does not exist here
}

To deal with that, the first option works:

default export (bar: array) => {
    let clientID; // Not const, because it will change
    for (const elem of bar) {
        clientID = elem.clientID;
    }
    return clientID;
}

This will thus return the last clientID (and since you said you have only one clientID, it should be ok), but it would be a little better of you could get the value of clientID outside the loop, except if you intend on exporting only the last value of clientID.

I hope that, even though you might not understand everything, you understand how to export the client ID you want to export, and that the key words I gave you allows you to easily find what you might need on the internet more easily than these 3 last days. Ask me if anything isn't clear enough, I'll answer when I'll have time

I think your problem is about your variable's scope. const is block-scoped so everything about clientID variable happens inside the for loop and does not affect outside. I guess you can use var or let up to your purpose. This is a quite explanatory article about difference between var, let, and const: https://www.freecodecamp/news/var-let-and-const-whats-the-difference/

MDN Document on const: https://developer.mozilla/en-US/docs/Web/JavaScript/Reference/Statements/const

I guess the way you can access the variable is by creating a let variable outside the loop then assign it a value in the loop, or create an array outside the loop and push values into it inside the loop, that way you can have access to the variable outside the loop's scope.

本文标签： javascriptexport a variable inside a function to be used in other modulesStack Overflow