“函数声明”和“函数表达式”其实说白了 就是定义函数的方式
函数声明:
function 函数名(){.....}
通过上面方式定义的函数就是函数声明
函数表达式:通过函数表达式定义函数的方式比较多
1. var a = function test(){...} // 这是命名的函数表达式
var a = function(){...} // 这是匿名的函数表达式
2. 将“函数声明”定义的函数 用一对小括号括起来,这样也形成了函数表达式
(function test(){.....}) //这样也是函数表达式
3. 还有就是在“函数声明”前加位运算符 也能构成函数表达式
例如:这些都是函数表达式
~function test(){.....}
+function test(){.....}
-function test(){.....}
!function test(){.....}
区别: 函数声明 和 函数表达式 有哪些区别那??
1.函数表达式可以直接 在后面加小括号执行(这就是函数自执行),而函数声明不可以
例如:
var a = function test() {
alert("hello");
}
// 这是一个函数表达式,在这个表达式后面加个括号,就可以自动执行函数了
var a = function test() {
alert("hello");// 刷新页面就弹出hello了
}();
而函数声明的方式 加个小括号是不可以执行的,例如 浏览器会提示这种写法是错误的
function test() {
alert("hello");
}();
2.函数声明 可以 被预解析,而函数表达式不可以;如果不明白js预解析的小伙伴,请参考另一篇文章《JS预解析》
例如:
window.onload = function () {
test();
function test() { // 函数声明
alert("hello");
}
}
通过函数声明的方式定义的函数是可以被预解析的,所以在function test()之前调用test()函数,自然弹出hello,
window.onload = function () {
a();
var a = function () { // 函数表达式
alert("hello");
}
}
通过函数表达式的方式定义的函数是不能被预解析的,所以在函数之前调用a(),就会报错
再看一个例子:
window.onload = function () {
a();
if(true){
function a() {
alert("1");
}
}else{
function a() {
alert("2");
}
}
}
我们本来想让 if 成立的时候弹出 1 ,不成立弹出 2
但是因为js会预解析,所以永远都是弹出2;但是使用函数表达式就可以避免这种情况
window.onload = function () {
if(true){
var a = function() {
alert("1");
}
}else{
var a = function() {
alert("2");
}
}
a();
}
因为函数表达式不会被预解析,所以会按正常的逻辑进行,自然就弹出的是 1
所以记住: 在写程序的时候,如果需要根据不同的条件判断 来决定执行不同的函数,那么此时一定要用“函数表达式”的形式来定义函数。这样可以避免很多错误发生