感受JavaScript之美
Posted 面包理想
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了感受JavaScript之美相关的知识，希望对你有一定的参考价值。
通过前面讲解，大家应该能做到：
1.手里有一份随时能够换工作自信的简历。
2.知道了学习js的正确姿势。
3.理解了全局对象、全局上下文、知道有预解析同时做了至少50道面试题。
4.能熟练的使用json构建数据，知道变量的各种类型。
------------------------华丽丽的分割线------------------------
以上四点主要是上课给学生讲的，下面我们继续正题。
这一篇我们讲函数，函数不过多讲怎么定义调用，如下很简单
function show(){
alert(12);
}
//定义
show();//调用
▲重点想说的是很多库里面函数的用法。
1.函数其实是一种特殊的对象。
这句话怎么分析，既然是对象那么就有属性和方法。好我们硬着头皮加一下。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>大彬哥版权所有翻录必究</title>
<meta name="copyright" content="尼古拉斯·屌·大彬哥">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<style>
</style>
<script>
function show(){
alert('我就是你大彬哥，爱好是开火车');
}
//属性
show.a = 12;
//方法
show.fn = function(){
alert('我擦嘞，还能这么玩？');
};
show.fn();
</script>
</head>
<body>
</body>
</html>
你运行就能看到结果了。
※解释下：
→其实函数就是一个特殊对象，相当于←
2.函数声明和函数表达式
为什么说它？因为这个是你理解匿名函数自执行和模块化，还有很多库比如jquery结构的基础。
大家不要被名字给吓到了。只要记住两者的写法和区别。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>大彬哥版权所有翻录必究</title>
<meta name="copyright" content="尼古拉斯·屌·大彬哥">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<style>
</style>
<script>
//函数声明
function show(){
console.log(12);
}
//函数表达式
var show = function(){
console.log(5);
};
show();
</script>
</head>
<body>
</body>
</html>
是不是简单的让人发指？
区别就一句话，函数声明，可以在函数调用之后，因为有函数预解析。而函数表达式必须在调用之前。因为如果在后面的画变量预解析会把show变成
undefiined.如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>大彬哥版权所有翻录必究</title>
<meta name="copyright" content="尼古拉斯·屌·大彬哥">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<style>
</style>
<script>
//函数声明
function show(){
console.log(12);
}
//函数表达式
show();//注意 这样写 变量show定义提前，变成var show;//undefined
var show = function(){
console.log(5);
};
</script>
</head>
<body>
</body>
</html>
3.匿名函数执行(IIFEs)初步理解
这货在js里面极其的重要，哈哈，因为有学生抱怨说我在课上总是说这个简单那个不用走心，那么这个我就要强调下；
这个东西不简单，很重要，而且要记住。因为这个东西太特么重要了。还是那句话别被定义吓到，看我干啥。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>大彬哥版权所有翻录必究</title>
<meta name="copyright" content="尼古拉斯·屌·大彬哥">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<style>
</style>
<script>
//第一步
var show = function () {
alert('那一年黄瓜还是用来吃的');
};
(show)();
//第二步 show = function(){xxxxx},那么结果是不是和(show)()一样
(function(){
alert('那一年黄瓜还是用来吃的');
})();
//函数没有名字自己调用执行了，就是匿名函数自执行。先明白怎么回事儿就行
</script>
</head>
<body>
</body>
</html>
到这里你只要知道，怎么回事儿就行，下一篇我们会讲函数的this和匿名函数自执行的应用就好了。
以上是关于感受JavaScript之美的主要内容，如果未能解决你的问题，请参考以下文章