Warum ist der folgende Wert in a || nicht? Zustand wird eingestellt?

Question

Die folgende Funktion wird die Sprache eines Rahmens auf die im Browser eingestellte Sprache basiert:

util.setLang = (lang) => { 
    console.log(lang) 
    let selectedLang = '' 
    const english = 'en' || 'en-US' || 'en-UK' 
    const chinese = 'zh' || 'zh-TW' || 'zh-CN' 
    if (lang === english) selectedLang = 'en' 
    if (lang === chinese) selectedLang = 'zh' 
    Vue.config.lang = selectedLang 
} 

Wenn console.log(lang) logs ‚zh‘. Es klappt. selectedLang ist auf 'zh' eingestellt. Wenn console.log(lang) 'zh-Tw' selectedLang protokolliert, wird es auf eine leere Zeichenfolge gesetzt.

Warum ist das?

Answer 1

Diese

const english = 'en' || 'en-US' || 'en-UK' 
const chinese = 'zh' || 'zh-TW' || 'zh-CN' 

wertet direkt an

const english = 'en' 
const chinese = 'zh' 

und die nächsten Zeilen hängt vom Wert von lang

if (lang === english) selectedLang = 'en' 
if (lang === chinese) selectedLang = 'zh' 

während english und chinese einen einzelnen Wert haben, der Vergleich nimmt diesen einzelnen Wert und co mpairs damit, aber nicht mit allen drei Werten.

Bessere Nutzung

const english = ['en', 'en-US', 'en-UK'] 
const chinese = ['zh', 'zh-TW', 'zh-CN'] 

mit indexOf Methode der Array und thest mit

if (english.indexOf(lang) !== -1) selectedLang = 'en' 
if (chinese.indexOf(lang) !== -1) selectedLang = 'zh' 

Answer 2

Das ist, ist, da die Zeichenfolge "a" || "b" Ist immer gleich "a".

Sie sollten die oder Betreiber im Zustand haben, anstatt in der Zeichenfolge mit vergleichen:

Wenn (lang == 'a' || lang == 'b')

Answer 3

Warum ist nicht der folgende Wert in a || Zustand wird eingestellt?

Denn wenn Sie sagen

const chinese = 'zh' || 'zh-TW' || 'zh-CN' 

Es wird gesetzt die chinese zu zh erst seit Boolean('zh') wahr ist.

Es geht nicht vorbei zh in dieser Kette.

Wenn Sie, dass chinesische Sprache Auswahl sicherstellen wollen, sollte man von 'zh', 'zh-TW', 'zh-CN' sein, dann machen es

util.setLang = (lang) => { 
    console.log(lang) 
    let selectedLang = '' 
    const english = ['en','en-US','en-UK']; 
    const chinese = ['zh','zh-TW','zh-CN']; 
    if (english.indexOf(selectedLang) != -1) selectedLang = 'en' 
    if (chinese.indexOf(selectedLang) != -1) selectedLang = 'zh' 
    Vue.config.lang = selectedLang 
} 

Noch mehr generische Lösung

var constLanguages = [ 
    ['en','en-US','en-UK'], 
    ['zh','zh-TW','zh-CN'] 
]; 
selectedLang = constLanguages.filter(function(val){ 
    return val.indexOf(selectedLang) != -1; 
})[0]; 

Dadurch wird sichergestellt sein, dass, wenn einer der Artikel passt in das Array, wird sein erstes Element die selectedLang

werden