为什么在函数中调用全局变量时,它是未定义的?

Why is a global variable undefined inside a function when I call it?

本文关键字:未定义 函数 调用 全局变量 为什么      更新时间:2023-09-26

此函数重定向到URL,但course_syllabus_code部分在URL后显示为undefined。我不知道为什么会这样。

基本上用户将能够打开代码并在顶部输入变量(将有多个)。再往下就是所有的奇迹应该发生的地方。

输入的变量的结构不能改变,但可能"魔法"没有以最好的方式执行。

const course_syllabus_code = "72524";
function syllabusLink(course_syllabus_code){
  location.href = "https://example.com/" + course_syllabus_code;
}
<ul>
  <li>
    <a href="javascript:syllabusLink();">Syllabus</a>
  </li>
</ul>

您将course_syllabus_code作为函数的参数传递,但调用函数时没有任何参数。当您调用一个参数少于其定义的函数时,您没有传递的参数将通过值undefined传递。由于您给函数参数指定了与全局变量相同的名称,因此它对函数中的代码"遮蔽"(模糊、隐藏)了全局变量,而函数中的代码将访问该参数。

您有三个选择(只执行其中的一个,而不是全部):

  1. 通过删除声明的函数参数来使用全局变量:

    function syllabusLink() {
    // Removed here ------^
    
  2. ,将全局变量传递给调用它的函数:

    <a href="javascript:syllabusLink(course_syllabus_code)"><img src="CourseButton3.png" />Syllabus</a>
    

    我可能也会更改参数的名称(这里我使用scode):

    function syllabusLink(scode) {
        location.href = 'https://foo.com'+scode;
    }
    
  3. ,不要使course_syllabus_code成为全局变量,并将其传递给函数:

    <a href="javascript:syllabusLink('72524')"><img src="CourseButton3.png" />Syllabus</a>
    

我可能会选择#3,除非有很好的理由它必须是一个全局变量

更改函数参数,因为它与局部变量同名。

var course_syllabus_code = "72524";
function syllabusLink(code) {
    location.href = 'https://foo.com' + code;
}

您应该将course_syllabus_code传递给href属性中的syllabusLink

<a href="javascript:syllabusLink(course_syllabus_code)"><img src="CourseButton3.png" />Syllabus</a>

试一下

  var course_syllabus_code = "72524";
function syllabusLink() {
location.href = 'https://foo.com'+course_syllabus_code;
}

因为在onClick()中你没有传递任何参数

course_音节us_code为全局变量。可以在函数中直接访问

这位错误:

javascript:syllabusLink()

您缺少参数,因此调用函数

function syllabusLink(course_syllabus_code) {

没有设置course_syllabus_code的值

除了bookmarklets,请不要使用javascript:协议。

更好的代码是这样的

<script type="text/javascript">
function syllabusLink(course_syllabus_code) {
   location.href = 'https://foo.com/course?syllabus='+course_syllabus_code;
   return false; // cancel link
}
</script>
<ul>
<li><a href="#" onclick="return syllabusLink('72524')"><img src="CourseButton3.png" />Syllabus</a></li>
</ul>

<script type="text/javascript">
var course_syllabus_code="72524";
function syllabusLink() {
   location.href = 'https://foo.com/course?syllabus='+course_syllabus_code;
   return false; // cancel link
}
</script>
<ul>
<li><a href="#" onclick="return syllabusLink()"><img src="CourseButton3.png" />Syllabus</a></li>
</ul>

简单的答案你需要传递course_syllabus_code作为function的参数。请将其从function参数中删除并尝试。

<script type="text/javascript">
var course_syllabus_code = "72524";
function syllabusLink() {
    location.href = 'https://foo.com'+course_syllabus_code;
}
</script>

原因是course_syllabus_code是全局变量,你可以直接在函数中访问