每日一道javascript面试题(九)函数的参数可以和函数体中的变量重名吗

简介: 每日一道javascript面试题(九)函数的参数可以和函数体中的变量重名吗

前言

  • 我是小嘟,努力每天分享一道javascript相关的题目。
  • 希望对你有所帮助。
  • 觉得有用的话,请点赞支持,你的鼓励是我坚持下去的动力。
  • 今天在牛客看面经的时候,发现这个题目,虽然只有几行代码,但是考的知识点还是挺难理解的。
  • 大家一起来看看吧!说的不对的地方欢迎指出。

题目一

function f(x = 3){
     var x;
     console.log("我是f的x:",x);
}
f(5) ;


  • 结果如下
本题知识点

本题考查知识点:函数的参数和函数体中的变量到底能不能重名呢?

小嘟这个题也做错了,然后就去看了阮老师的es6文档,从中又学到了新的知识(真的是每次读每次有新的感悟)。

感悟:参数变量是默认声明的,所以在函数体中不能再用let或const声明(这个是官方文档里边说的哦),但是用var还可以声明的,说到这里我们还是不能解决这个问题,然后我又参考了木易杨大佬的解释:

  • 总结一下:我们不能用let和const再次声明已经存在的变量名,用var声明的变量不会覆盖参数的变量。


  • 对var再详细说下
  • (1)如果在函数体仅仅是声明变量但是没有赋值,那么在函数体中打印该变量的值则是参数中存储的值。
  • (2)如果声明并且赋值了,那么在函数体中打印该变量的值则是函数体中变量的值,请看下边的例子:


function f(x = 3){
     var x;
     console.log("我是f的x:",x);
}
f(5);
function f1(x = 3){
     var x = 7;
     console.log("我是f1的x:",x);
}
f1(5);
结果如下

题目二(函数作用域)

function f2(x, y = function() {console.log("我是赋值前的x:",x); x = 2; console.log("我是赋值后的x:",x); }) 
{
      var x = 3;
      y();
      console.log("我是函数体中的x:",x);
}
f2();


结果如下

分析
  • 读者是不是都迷糊啦,说实话,小嘟我也迷啦,所以这篇文章小嘟写了好几天,生怕什么地方解释的太离谱了。若觉得不错请点赞支持,小嘟我会继续努力的。
  • 这个题我在阮老师的文档中找到了依据:



也正是因为如此,y中x指向的是参数中的x而不是函数体中的x,说到这里大家应该基本明白这个结果为什么是这样。这里小嘟产生了一个新的问题:既然是不同的作用域,那么为什么不能使用let和const声明相同的变量名呢?

最后我给自己的解释是:是不同的作用域,但是不是不同的块级作用域,(js中有函数作用域、全局作用域、块级作用域,这里我认为应该是在同一个块级作用域,否则不应该报语法错误)所以应该是这样的一个原因。(大家仅供参考,欢迎下方指正)

  • 说了这么多还没有演示letconst声明会发生什么呢?

题目三(let声明)

function f(x = 3){
     var x;
     console.log("我是f的x:",x);
}
f(5);
function f1(x = 3){
     var x = 7;
     console.log("我是f1的x:",x);
}
f1(5);
function f2(x = 3){
     let x;
     console.log("我是f2的x:",x);
}
f2(5) ;
结果如下

  • 我们知道js会有一个预编译的过程,将函数声明提升、将var声明的变l量提升、检查语法等。从这个结果中我们会发现一个结果都没有执行,如果没有预编译的过程那么应该会输出前两个结果的。

题目四(const声明)

function f(x = 3){
     var x;
     console.log("我是f的x:",x);
}
f(5);
function f1(x = 3){
     var x = 7;
     console.log("我是f1的x:",x);
}
f1(5);
function f3(x = 3){
      const x;
      console.log("我是f3的x:",x);
}
f3(5) ;


结果如下

结尾

  • 以上就是本节内容,若有问题,欢迎评论区留言。
  • 觉的对你有所帮助,请点赞👍评论👈,要是能给个关注➗更
相关文章
|
12天前
|
JavaScript 前端开发 Java
[JS]同事:这次就算了,下班回去赶紧补补内置函数,再犯肯定被主管骂
本文介绍了JavaScript中常用的函数和方法,包括通用函数、Global对象函数以及数组相关函数。详细列出了每个函数的参数、返回值及使用说明,并提供了示例代码。文章强调了函数的学习应结合源码和实践,适合JavaScript初学者和进阶开发者参考。
25 2
[JS]同事:这次就算了,下班回去赶紧补补内置函数,再犯肯定被主管骂
|
14天前
|
SQL Oracle 关系型数据库
[Oracle]面试官:你举例几个内置函数,并且说说如何使用内置函数作正则匹配
本文介绍了多种SQL内置函数,包括单行函数、非空判断函数、日期函数和正则表达式相关函数。每种函数都有详细的参数说明和使用示例,帮助读者更好地理解和应用这些函数。文章强调了字符串操作、数值处理、日期计算和正则表达式的使用方法,并提供了丰富的示例代码。作者建议读者通过自测来巩固学习成果。
13 1
[Oracle]面试官:你举例几个内置函数,并且说说如何使用内置函数作正则匹配
|
13天前
|
前端开发 JavaScript
如何在 JavaScript 中访问和修改 CSS 变量?
【10月更文挑战第28天】通过以上方法,可以在JavaScript中灵活地访问和修改CSS变量,从而实现根据用户交互、页面状态等动态地改变页面样式,为网页添加更多的交互性和动态效果。在实际应用中,可以根据具体的需求和场景选择合适的方法来操作CSS变量。
|
13天前
|
前端开发 JavaScript 数据处理
CSS 变量的作用域和 JavaScript 变量的作用域有什么不同?
【10月更文挑战第28天】CSS变量和JavaScript变量虽然都有各自的作用域概念,但由于它们所属的语言和应用场景不同,其作用域的定义、范围、覆盖规则以及与其他语言特性的交互方式等方面都存在明显的差异。理解这些差异有助于更好地在Web开发中分别运用它们来实现预期的页面效果和功能逻辑。
|
11天前
|
JavaScript 前端开发
.js方法参数argument
【10月更文挑战第26天】`arguments` 对象为JavaScript函数提供了一种灵活处理参数的方式,能够满足各种不同的参数传递和处理需求,在实际开发中具有广泛的应用价值。
27 7
|
13天前
|
前端开发 JavaScript UED
如何使用 JavaScript 动态修改 CSS 变量的值?
【10月更文挑战第28天】使用JavaScript动态修改CSS变量的值可以为页面带来更丰富的交互效果和动态样式变化,根据不同的应用场景和需求,可以选择合适的方法来实现CSS变量的动态修改,从而提高页面的灵活性和用户体验。
|
11天前
|
前端开发 JavaScript 开发者
除了 Generator 函数,还有哪些 JavaScript 异步编程解决方案?
【10月更文挑战第30天】开发者可以根据具体的项目情况选择合适的方式来处理异步操作,以实现高效、可读和易于维护的代码。
|
25天前
|
JavaScript 前端开发
JavaScript 函数语法
JavaScript 函数是使用 `function` 关键词定义的代码块,可在调用时执行特定任务。函数可以无参或带参,参数用于传递值并在函数内部使用。函数调用可在事件触发时进行,如用户点击按钮。JavaScript 对大小写敏感,函数名和关键词必须严格匹配。示例中展示了如何通过不同参数调用函数以生成不同的输出。
|
27天前
|
存储 JavaScript 前端开发
JS函数提升 变量提升
【10月更文挑战第6天】函数提升和变量提升是 JavaScript 语言的重要特性,但它们也可能带来一些困惑和潜在的问题。通过深入理解和掌握它们的原理和表现,开发者可以更好地编写和维护 JavaScript 代码,避免因不了解这些机制而导致的错误和不一致。同时,不断提高对执行上下文等相关概念的认识,将有助于提升对 JavaScript 语言的整体理解和运用能力。
|
25天前
|
JavaScript 前端开发
局部 JavaScript 变量
JavaScript 中,函数内部使用 `var` 声明的变量为局部变量,仅在函数内可见,函数执行完毕后被删除。全局变量则在函数外部声明,整个页面的脚本和函数均可访问,页面关闭后才被删除。未声明的变量赋值会自动成为 `window` 对象的属性,且在非严格模式下可被删除。