Phpstorm 警告字符串不可分配给参数类型答案

【问题标题】：Phpstorm warning string is not assignable to parameter typePhpstorm 警告字符串不可分配给参数类型
【发布时间】：2020-02-24 05:32:58
【问题描述】：

我有这样的 language.js 文件：

if (localStorage.getItem('lang') === 'en') {
   const LANGCONVERT = {
       "accept": "Accept",
       "accept_invitation": "Accept Invitation"
   }
} else {
   const LANGCONVERT = {
       "accept": "Aceptar",
       "accept_invitation": "Aceptar la invitacion"
   }
}

我从另一个脚本调用这个脚本。并像这样使用：

console.log(LANGCONVERT.accept);

它可以工作，但 phpstorm 显示警告：

未解析的变量或类型 LANGCONVERT

参数类型字符串 |字符串不能分配给参数类型

检查 JavaScript 调用的函数参数、返回值、分配的表达式的类型是否正确。验证适用于 JavaScript、html 或 jsp 文件。

【问题讨论】：

用let 或const 声明的变量具有块作用域，因此您无法访问if 语句之外的变量。
@Barmar 我应该用什么？

标签： jquery

【解决方案1】：

用let 或const 声明的变量是块作用域的。需要在if语句外声明变量，然后在if中赋值。

let LANGCONVERT;
if (localStorage.getItem('lang') === 'en') {
   LANGCONVERT = {
       "accept": "Accept",
       "accept_invitation": "Accept Invitation"
   }
} else {
   LANGCONVERT = {
       "accept": "Aceptar",
       "accept_invitation": "Aceptar la invitacion"
   }
}

或者您可以使用条件表达式对其进行初始化：

const LANGCONVERT = localStorage.getItem('lang') === 'en' ? 
    {
       "accept": "Accept",
       "accept_invitation": "Accept Invitation"
    } : {
       "accept": "Aceptar",
       "accept_invitation": "Aceptar la invitacion"
    };

【讨论】：

【解决方案2】：

我会使用稍微不同的方法。您尝试使用常量的方式仅限于条件中使用的块范围。

为什么不将所有与语言相关的字符串放入一个模块或单独的文件中。类似translation.en.js 和translation.es.js 把 const 放在里面。根据您的 localStorage 变量仅加载一个文件。

获取语言变量

let lang = localStorage.getItem('lang')

如果您可以导入模块（使用转译器以实现兼容性）

import {TRANSLATIONS} from `path/to/translation.${lang}.js`

如果没有，那就去老学校

let languageFile=document.createElement('script')
     languageFile.setAttribute("type","text/javascript")
     languageFile.setAttribute("src", `path/to/translation.${lang}.js`)
     document.body.appendChild(languageFile)

然后像这样使用它：

    const LANGCONVERT = {
       accept: TRANSLATIONS['accept'],
       accept_invitation: TRANSLATIONS['accept_invitation']
   }

或将解构用于更短的符号（同样仅在使用转译器时）

   let {accept, accept_invitation} = TRANSLATIONS
   const LANGCONVERT = {accept, accept_invitation}

语言文件示例

// make sure to export the const for module usage
const TRANSLATIONS = {
    accept: 'Accept'
    accept_invitation: 'Accept Invitation'
}

你明白了。请记住，let, const, this 都绑定到父块作用域，除此之外你不能真正使用它们。如果可以的话，要克服这种使用模块，如果不能，请确保在全局上下文中声明它们。

希望我至少给了你一些有用的提示。

【讨论】：