reactjs - React native typescript nummer 0 leses som NaN

Jeg prøver å mappe et array og bruke verdiene eller nøklene som data for returverdien min i React Native (Android). Kan noen forklare hvorfor verdien 0 blir lest som NaN? Jeg har lagt merke til det samme problemet når jeg bruker en TypeScript-enum.

Jeg bruker: typescript v.4.7.4, RN 0.69.2 og react 18

Enkelt kodeeksempel med konsollutskrift:

const R = [...Array(4).keys()];
R.map((_i, key) => {
  console.log(_i, key);
}); 


Output: 
NaN NaN  // value 0 is interpreted as NaN ???
1 1
2 2
3 3

Dette ser ut til å skje bare når verdien vurderes direkte via console.log eller VSCode-inspektøren i debug-modus. Når jeg bruker en template-streng, vises verdien riktig.

R.forEach(i => {
  console.log(`value is : ${i} is ${typeof i}`);
  console.log(i);
});

Output: 
value is : 0 is number
NaN
value is : 1 is number
1
value is : 2 is number
2
value is : 3 is number
3

All hjelp er verdsatt.

output for 'npx react-native info'

info Fetching system and libraries information...
System:
    OS: Windows 10 10.0.22000
    CPU: (12) x64 Intel(R) Core(TM) i7-8700K CPU @ 3.70GHz
    Memory: 11.90 GB / 31.92 GB
  Binaries:
    Node: 18.6.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.15 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 8.13.2 - C:\Program Files\nodejs\npm.CMD
    Watchman: Not Found
  SDKs:
    Android SDK:
      API Levels: 31, 33
      Build Tools: 30.0.3, 33.0.0
      System Images: android-32 | Google APIs Intel x86 Atom_64, android-33 | Google APIs Intel x86 Atom_64, android-33 | Google Play Intel x86 Atom_64
      Android NDK: Not Found
    Windows SDK:
      AllowAllTrustedApps: Enabled
      AllowDevelopmentWithoutDevLicense: Enabled
      Versions: 10.0.19041.0
  IDEs:
    Android Studio: AI-212.5712.43.2112.8609683
    Visual Studio: 17.1.32328.378 (Visual Studio Community 2022), 16.11.32106.194 (Visual Studio Community 2019)
  Languages:
    Java: 17.0.1 - C:\Program Files\Java\jdk-17.0.1\bin\javac.EXE
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.0.0 => 18.0.0
    react-native: 0.69.2 => 0.69.2
    react-native-windows: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

Svar #1

Som det viser seg, er dette en slags problem med VSCode.

NaN-utdataene vises bare når du bruker VSCode Debug Console eller den aktive VSCode-debuggeren (når du holder musepekeren over variabelen).

Logcat-utdataene er korrekte. Videre viser console.log(typeof variable) at variabeltypen er number (noe som faktisk er korrekt).

const R = [...Array(4).keys()];
R.map((_i, key) => {
  console.log(_i, key,typeof _i,typeof number);
}); 

Output in VSCode Debuger Console: 
NaN NaN number number
1 1 number number
2 2 number number
3 3 number number

Output via Logcat
0 0 number number
1 1 number number
2 2 number number
3 3 number number

Takk for hjelpen alle sammen !!

Svar #2

For meg på typescriptlang.org med React Native, Target ES2017 og Module ESNext, får jeg korrekt utgang:

Output: 
0, 0
1, 1
2, 2
3, 3

Men feilen din kan ha noe å gjøre med dette:

console.log([...Array(4)]);

Som produserer:

[undefined, undefined, undefined, undefined]

Så kanskje det å ta key() for den første udefinerte verdien ga en NaN? Ved å bruke dette:

console.log([undefined].keys());

Gir :

{}

Relaterte artikler