博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
js - AO链 与 function
阅读量:6893 次
发布时间:2019-06-27

本文共 1309 字,大约阅读时间需要 4 分钟。

先来看一下demo,如果你已经看出三个console.log分别输出什么。那直接关闭此笔记

function t(age) {    console.log(age);    var age = 99;    console.log(age);    function age() {    }    console.log(age);}t(5);

答案揭晓:第一次输出age()函数,第二次输出99,第三次输出99 

如果你猜不到答案且一脸懵逼,请继续往下看,请注意,其实一点都不难,甚至知识点你都已经掌握,只是场景和demo的问题让你一时间转不过来

 

先来分析第一个console.log(age),按照我们正常的程序运行流程理解,你是不是觉得:t(5)传入了形参5.那么第一个输出的也应该是5才对吧?为什么会输出age函数?它又还没被执行声明。

 

带着这个疑问我们来看看另一个简单的demo:

运行这段代码,会弹出提示框“123”。无论你觉得正常也好,觉得奇怪也好。但我们得出一个结论:

在一段函数代码块中【function fuck()】,函数【function you()】会自动被提前声明,哪怕还没有执行到它。这是javascript一个很“贴心”的机制。规则1:  形参 < 函数定义。由于形参先声明,函数(自动)后声明。 于是同名形参you,会被同名的函数you替换掉。所以才会弹出提示框“123”。

带着这个javascript这个“贴心”的机制,我们回到第一个console.log,不难理解,其实本该输出的形参"5",就是被自动声明的age函数给替换掉了。所以输出了age函数

 

再来看看第二个console.log,程序继续往下执行

var age = 99;

 这时,age函数又被99替换,所以第二个输出是99

 

程序继续往下执行,此时我们看到的

function age() {    }

由于这一句已经被javascript的“贴心”机制提前声明执行了。所以这里不会再执行,所以让我们跳过这一句。

执行最后一句console.log(age); 理所当然不变的输出了99。

规则2:函数定义 < var变量定义 由于函数先执行,var后执行,所以同名的函数会被var定义的同名变量所覆盖

 

 

最后总结:只有函数代码块内,出现定义了函数的情况,才需要注意这些细节,否则按照正常的程序流程顺序执行即可。

 

以上!!

 


 

练习题1:

 请在不执行代码的情况下,推导出两次console.log分别输出什么值?

 答案:第一次输出“mp”,第二次输出you函数。

 解析:请注意,这里的function是通过var进行变量定义的。属于var变量定义(规则2)。

也就是说,实际上这段代码并没有出现【函数中定义函数】的情况,

所以这段代码只需要按照正常的程序流程执行推导即可。

 

练习题2:

上一题的变形, 请在不执行代码的情况下,推导出两次console.log分别输出什么值?

答案:第一次输出123,第二次输出you函数。

转载于:https://www.cnblogs.com/CyLee/p/6289724.html

你可能感兴趣的文章
一张图带你了解Aspose 2019年的产品线
查看>>
一篇关于MySQL server层执行查询语句的注释,非常棒
查看>>
js执行过程之上下文对象(Context)
查看>>
使用迭代器遍历集合出现ConcurrentModificationException的总结
查看>>
java 合并pdf
查看>>
使用vue实现grid-layout功能
查看>>
DPR
查看>>
Item 11 Override clone judiciously
查看>>
程序员过关斩将--请不要随便修改基类
查看>>
Golang 并发,有缓存通道,通道同步案例演示
查看>>
一件事件
查看>>
设计模式学习专栏五--------命令模式
查看>>
webpack 持久化缓存
查看>>
WebRTC 入门教程(二)|WebRTC信令控制与STUN/TURN服务器搭建
查看>>
前端成长DAY.1 Html+CSS
查看>>
mysql rownum in hibernate
查看>>
Redux源码完全解读
查看>>
wordpress主题制作教程(12):单页面模板page.php
查看>>
Android 使用RecyclerView实现轮播图
查看>>
表单的checkbox switch开关设计
查看>>