blocks|key|1503779|text|您的问题似乎与代码的异步性质有关。让我解释一下。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1503780|var+country+=+'';
fetch('https://extreme-ip-lookup.com/json/')
++++.then(+res+=>+res.json())
++++.then(response+=>+{
++++++++var+cc+=+(response.countryCode);
++++++++country+=+cc;
++++});
console.log(country);|code-block|syntax|javascript|1503781|fetch函数是异步的。这就是您需要.then方法的原因。这意味着当fetch函数运行时，JavaScript不会停止程序的其余部分，而是在fetch()在后台运行时继续运行。因此，当您使用console.log(country)时，它仍然是原始值(空字符串)。|offset|length|style|CODE|1503782|要回答您的问题，可以使用Promises来记录cc的值。|1503783|var+country+=+'';
const+fetchPromise+=+fetch('https://extreme-ip-lookup.com/json/')
++++.then(+res+=>+res.json())
++++.then(response+=>+{
++++++++var+cc+=+(response.countryCode);
++++++++country+=+cc;
++++});

Promise.resolve(fetchPromise)+//+Waits+for+fetchPromise+to+get+its+value
++++.then(()+=>+console.log(country))|1503784|你可以在MDN+docs上找到更多关于promises的信息|1503785|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise^0|0|0|I|5|1Y|7|2N|K|0|C|7|0|0|4|8|0|0^^$0|@$1|2|3|4|5|6|7|10|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|11|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|12|8|@$I|13|J|14|K|L]|$I|15|J|16|K|L]|$I|17|J|18|K|L]]|9|@]|A|$]]|$1|M|3|N|5|6|7|19|8|@$I|1A|J|1B|K|L]]|9|@]|A|$]]|$1|O|3|P|5|D|7|1C|8|@]|9|@]|A|$E|F]]|$1|Q|3|R|5|6|7|1D|8|@]|9|@$I|1E|J|1F|1|1G]]|A|$]]|$1|S|3|-4|5|6|7|1H|8|@]|9|@]|A|$]]]|T|$U|$5|V|W|X|A|$Y|Z]]]]

<p>It seems like your problem has to do with the asynchronous nature of your code. Let me explain.</p>
<pre class="lang-js prettyprint-override"><code>var country = '';
fetch('https://extreme-ip-lookup.com/json/')
    .then( res =&gt; res.json())
    .then(response =&gt; {
        var cc = (response.countryCode);
        country = cc;
    });
console.log(country);
</code></pre>
<p>The fetch function is asynchronous. That's why you need the <code>.then</code> methods. This means that while the fetch function runs, JavaScript doesn't stop the rest of the program, and instead moves on while <code>fetch()</code> runs in the background. Hence, when you <code>console.log(country)</code>, it's still of the original value (empty string).</p>
<p>To answer your question, you can use <code>Promise</code>s to log the value of cc.</p>
<pre class="lang-js prettyprint-override"><code>var country = '';
const fetchPromise = fetch('https://extreme-ip-lookup.com/json/')
    .then( res =&gt; res.json())
    .then(response =&gt; {
        var cc = (response.countryCode);
        country = cc;
    });

Promise.resolve(fetchPromise) // Waits for fetchPromise to get its value
    .then(() =&gt; console.log(country))
</code></pre>
<p>You can find out more about promises at the <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise" rel="nofollow noreferrer">MDN docs</a></p>


blocks|key|5287541|text|你的问题来自于你的fetch是一个异步函数，带有一个promise。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5287542|你想做的是(我想)|5287543|var+country+=+'';
//then
fetch('https://extreme-ip-lookup.com/json/')
.then(+res+=>+res.json())
.then(response+=>+{
++++var+cc+=+(response.countryCode);
++++country+=+cc;
+});
//then
console.log(country);|code-block|syntax|javascript|5287544|但是，由于您使用的是异步函数，因此将执行以下操作：|5287545|//first
var+country+=+'';
//second
fetch('https://extreme-ip-lookup.com/json/')
.then(+res+=>+res.json())
.then(response+=>+{
++++//fourth
++++var+cc+=+(response.countryCode);
++++country+=+cc;
+});
//third
console.log(country);|5287546|如何解决这个问题？视情况而定。如果您的console.log是由按钮触发的，请让它等待国家/地区被填写|5287547|否则，将您的代码放在最后，或者使用Promise.all()+(documentation+here)|offset|length|style|CODE|5287548|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise/all^0|0|0|0|0|0|0|H|D|1A|4|0|0^^$0|@$1|2|3|4|5|6|7|12|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|13|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|14|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|15|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|16|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|17|8|@]|9|@]|A|$]]|$1|O|3|P|5|6|7|18|8|@$Q|19|R|1A|S|T]]|9|@$Q|1B|R|1C|1|1D]]|A|$]]|$1|U|3|-4|5|6|7|1E|8|@]|9|@]|A|$]]]|V|$W|$5|X|Y|Z|A|$10|11]]]]

<p>Your problem come from the fact that your fetch is an asynchrone function, with a promise.</p>
<p>What you want to do is that (I suppose)</p>
<pre><code>var country = '';
//then
fetch('https://extreme-ip-lookup.com/json/')
.then( res =&gt; res.json())
.then(response =&gt; {
    var cc = (response.countryCode);
    country = cc;
 });
//then
console.log(country);
</code></pre>
<p>But, since you use an async function, this is what is done:</p>
<pre><code>//first
var country = '';
//second
fetch('https://extreme-ip-lookup.com/json/')
.then( res =&gt; res.json())
.then(response =&gt; {
    //fourth
    var cc = (response.countryCode);
    country = cc;
 });
//third
console.log(country);
</code></pre>
<p>How to fix that? it depend. If your console.log is triggered by a button, make it wait for country to be filled</p>
<p>else, put your code in the last then, or use <code>Promise.all()</code> (documentation <a href="https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise/all" rel="nofollow noreferrer">here</a>)</p>


blocks|key|1503833|text|在解析fetch之前发生了console.log。试试这个：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1503834|let+country+=+'';
fetch('https://extreme-ip-lookup.com/json/')
++++.then(res+=>+res.json())
++++.then(res+=>+country+=+res.countryCode)
++++.then(()+=>+console.log(country))|code-block|syntax|javascript|1503835|entityMap^0|3|5|D|B|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]|$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|R|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|S|8|@]|D|@]|E|$]]]|L|$]]

<p><code>console.log</code> is happening before <code>fetch</code> is resolved. Try this:</p>
<pre><code>let country = '';
fetch('https://extreme-ip-lookup.com/json/')
    .then(res =&gt; res.json())
    .then(res =&gt; country = res.countryCode)
    .then(() =&gt; console.log(country))
  
</code></pre>


blocks|key|1354056|text|在country设置为response.countryCode之前，当前调用console.log(country)的问题。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1354057|您可以通过以下方式将代码放在异步IIFE中来解决此问题：|1354058|​|1354059|(async+()+=>+{
++const+response+=+await+fetch('https://extreme-ip-lookup.com/json/');
++const+ipData+++=+await+response.json();
++const+country++=+ipData.countryCode;

++//+place+all+code+that+uses+`country`+in+here
++console.log(country);
})();|code-block|syntax|javascript|1354060|1354061|1354062|如果您有另一个脚本，其函数定义依赖于county，请确保接受它作为参数，并且不要从全局变量中提取数据。|1354063|//+helper_functions.js

//+Bad
function+someFunctionThatUsesCountry()+{
++console.log(country);+//+<-+don't+expect+the+global+to+be+set
}

//+Good
function+someFunctionThatUsesCountry(country)+{
++console.log(country);+//+pull+country+%5E+from+the+parameter+list
}|1354064|然后，您可以通过仅传递该值来调用生命周期中的其他脚本。|1354065|(async+()+=>+{
++//+...
++someFunctionThatUsesCountry(country);
})();|1354066|1354067|如果因为某些原因非常想要一个全局变量。您应该将promise放在这个变量中，而不是放在值中。有了这个承诺，您可以传递该值，并在该值可用时通知其他脚本。|1354068|//+script_1.js
window.country+=+fetch('https://extreme-ip-lookup.com/json/')
+++++++++++++++++.then(response+=>+response.json())
+++++++++++++++++.then(ipData+=>+ipData.countryCode);|1354069|//+script_2.js+(must+be+loaded+after+script_1.js)
window.country.then(country+=>+{+//+<-+wait+until+country+is+available
++//+do+stuff+with+country
++console.log(country);
});|1354070|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/Glossary/IIFE^0|1|7|B|K|12|K|0|G|4|0|0|0|0|0|0|I|6|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|1D|8|@$9|1E|A|1F|B|C]|$9|1G|A|1H|B|C]|$9|1I|A|1J|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|1K|8|@]|D|@$9|1L|A|1M|1|1N]]|E|$]]|$1|H|3|I|5|6|7|1O|8|@]|D|@]|E|$]]|$1|J|3|K|5|L|7|1P|8|@]|D|@]|E|$M|N]]|$1|O|3|I|5|6|7|1Q|8|@]|D|@]|E|$]]|$1|P|3|-4|5|6|7|1R|8|@]|D|@]|E|$]]|$1|Q|3|R|5|6|7|1S|8|@$9|1T|A|1U|B|C]]|D|@]|E|$]]|$1|S|3|T|5|L|7|1V|8|@]|D|@]|E|$M|N]]|$1|U|3|V|5|6|7|1W|8|@]|D|@]|E|$]]|$1|W|3|X|5|L|7|1X|8|@]|D|@]|E|$M|N]]|$1|Y|3|-4|5|6|7|1Y|8|@]|D|@]|E|$]]|$1|Z|3|10|5|6|7|1Z|8|@]|D|@]|E|$]]|$1|11|3|12|5|L|7|20|8|@]|D|@]|E|$M|N]]|$1|13|3|14|5|L|7|21|8|@]|D|@]|E|$M|N]]|$1|15|3|-4|5|6|7|22|8|@]|D|@]|E|$]]]|16|$17|$5|18|19|1A|E|$1B|1C]]]]

<p>The problem with your currently call <code>console.log(country)</code> before <code>country</code> is set to <code>response.countryCode</code>.</p>
<p>You could solve this by placing your code inside an async <a href="https://developer.mozilla.org/en-US/docs/Glossary/IIFE" rel="nofollow noreferrer">IIFE</a> in the following manner:</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>(async () =&gt; {
  const response = await fetch('https://extreme-ip-lookup.com/json/');
  const ipData   = await response.json();
  const country  = ipData.countryCode;

  // place all code that uses `country` in here
  console.log(country);
})();</code></pre>
</div>
</div>
</p>
<hr />
<p>If you have another script with function definitions that depends on <code>county</code> be sure to accept it as parameter and don't pull the data from a global variable.</p>
<pre><code>// helper_functions.js

// Bad
function someFunctionThatUsesCountry() {
  console.log(country); // &lt;- don't expect the global to be set
}

// Good
function someFunctionThatUsesCountry(country) {
  console.log(country); // pull country ^ from the parameter list
}
</code></pre>
<p>You can then call you other script inside the IIFE by just passing the value.</p>
<pre><code>(async () =&gt; {
  // ...
  someFunctionThatUsesCountry(country);
})();
</code></pre>
<hr />
<p>If for some reason want a global variable really bad. You should place the promise inside this variable, not the value. With this promise you can pass the value, as well as notify other scripts when this value is available.</p>
<pre><code>// script_1.js
window.country = fetch('https://extreme-ip-lookup.com/json/')
                 .then(response =&gt; response.json())
                 .then(ipData =&gt; ipData.countryCode);
</code></pre>
<pre><code>// script_2.js (must be loaded after script_1.js)
window.country.then(country =&gt; { // &lt;- wait until country is available
  // do stuff with country
  console.log(country);
});
</code></pre>


blocks|key|3819163|text|fetch返回一个Promise，因此在您的问题中使用.then()链。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|3819164|但如果你踏进了“希望之地”，你就不会发现了。你必须用承诺来做每一件事。|3819165|但是您可以将您的逻辑拆分成可管理的小部分，如下所示|3819166|​|3819167|console.clear()

let+cached+=+null;
const+lookup+++++++++=+()++++++++++=>+fetch('https://extreme-ip-lookup.com/json/');
//+Caching+json+and+not+the+fetch+promise,+because
//+https://stackoverflow.com/a/54731385/476951
const+getJson++++++++=+()++++++++++=>+cached+=+cached+%7C%7C+lookup()+.then(response+=>+response.json());
const+getParameter+++=+(parameter)+=>+getJson()+++++++++++++++++++.then(json+=>+json[parameter]);
const+getCountry+++++=+()++++++++++=>+getParameter('country')+++++.then(value+=>+value);
const+getCountryCode+=+()++++++++++=>+getParameter('countryCode')+.then(value+=>+value);


getCountryCode().then(countryCode+=>+{
++console.log('countryCode:',+countryCode)
})

getCountry().then(country+=>+{
++console.log('country:',+country)
})

getParameter('city').then(city+=>+{
++console.log('city:',+city)
})|code-block|syntax|javascript|3819168|3819169|entityMap^0|0|5|9|7|R|7|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|T|8|@$9|U|A|V|B|C]|$9|W|A|X|B|C]|$9|Y|A|Z|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|10|8|@]|D|@]|E|$]]|$1|H|3|I|5|6|7|11|8|@]|D|@]|E|$]]|$1|J|3|K|5|6|7|12|8|@]|D|@]|E|$]]|$1|L|3|M|5|N|7|13|8|@]|D|@]|E|$O|P]]|$1|Q|3|K|5|6|7|14|8|@]|D|@]|E|$]]|$1|R|3|-4|5|6|7|15|8|@]|D|@]|E|$]]]|S|$]]

<p><code>fetch</code> returns a <code>Promise</code>, hence the <code>.then()</code> chain in your question.</p>
<p>But if you stepped into Promise Land, you won't find out. You'll have to do everything with Promises.</p>
<p>But you might split you logic into small manageable parts like here</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>console.clear()

let cached = null;
const lookup         = ()          =&gt; fetch('https://extreme-ip-lookup.com/json/');
// Caching json and not the fetch promise, because
// https://stackoverflow.com/a/54731385/476951
const getJson        = ()          =&gt; cached = cached || lookup() .then(response =&gt; response.json());
const getParameter   = (parameter) =&gt; getJson()                   .then(json =&gt; json[parameter]);
const getCountry     = ()          =&gt; getParameter('country')     .then(value =&gt; value);
const getCountryCode = ()          =&gt; getParameter('countryCode') .then(value =&gt; value);


getCountryCode().then(countryCode =&gt; {
  console.log('countryCode:', countryCode)
})

getCountry().then(country =&gt; {
  console.log('country:', country)
})

getParameter('city').then(city =&gt; {
  console.log('city:', city)
})</code></pre>
</div>
</div>
</p>


<p>I'm trying to receive the output for the following code where the cc variable would log a value into the empty global country variable. Afterwards print it to the console, however it isn't working. How would I make the local variable cc here to global/give the global variable country a value?</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>var country = '';
fetch('https://extreme-ip-lookup.com/json/')
.then( res =&gt; res.json())
.then(response =&gt; {
    var cc = (response.countryCode);
    country = cc;
 });
 console.log(country);</code></pre>
</div>
</div>
</p>


How do I make the output of this Javascript API response global?

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我正在尝试接收以下代码的输出，其中cc变量会将一个值记录到空的全局国家变量中。然后将其打印到控制台，但是它不起作用。如何将本地变量cc设置为global /为全局变量country赋值？​var country = '';fetch('https://extreme-ip-lookup.com/json/').then...

问如何使此Javascript API响应的输出成为全局的？
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使此Javascript API响应的输出成为全局的？EN