javascript - 使从输入中获取值的变量在词法范围内可用。javascript

Question

我无法理解为什么我无法将此处放置在全局范围中的 ( name ) 变量用于我的函数 greeting1() 的词法范围。我想为所有函数使用这些值，并且不想在每个函数中继续写。这是否与我单击提交按钮之前没有存储在值中的值有关，这就是为什么它返回一个空字符串作为名字和姓氏值的原因？

const firstname = $('#firstname').val();
const lastname = $('#lastname').val();
let name = G$(firstname, lastname);

 // example using jQueryGreet()
var greeting1 = function () {

const lang = $('#lang').val();

name.setLang(lang).jQueryGreet('#greeting', true).log();
console.log(name);

}

//example using vanillaGreet()
var greeting2 = function () {

const lang = document.getElementById('lang').value;

name.setLang(lang).vanillaGreet('#greeting').log();

}

$('#login').click(greeting1);

当我将名字、姓氏和名字变量放入函数中时它可以工作，但当我将它们取出时却不行。

另外，不要介意 G$() 和其他看起来很奇怪的函数。它们只是我为练习而建造的图书馆。