JS中定义function不同方式的区别
JS中定义function不同方式的区别
java : fname = test(data);
js : fname = test(data)
java和js都有调用方法返回值赋值给对象的方法。但是在js中使用返回值赋值时,经常会有报错,比如,会先执行赋值后执行方法,或者赋值时未找到赋值对象等。这些在java中使用时不会出现的问题,在js使用时比比皆是。主要原因js定义function方式不同,会产生不同的效果,而影响了使用方法返回值赋值的使用。
js中定义function主要有三种方式:
一:实际上就和我们最为平常的方法是一样的。
function fname(test){ alert(""+test); }
二:通过Function的函数的构造器进行函数对象的定义。
var fname = new Function("test", "alert(''+test);"); 第一个参数实际上是表示要传入函数中的参数,二第二个参数表示的是当前的函数要执行的过程。两个参数实际上都是string类型的。但是又上可以看出实际上当前的内容是十分的繁杂。
三:通过变量只带一块function关键字定义的方法来进行定义。
var fname = function(test){alert(""+test);}
上面的三种方法虽然最后都是声明定义了一个函数,但是也是有区别的。第一种方法实际上是为函数命名为fname,而二三种方法使用起来实际上是把一个匿名函数赋值给一个变量。使用第二种方法来定义函数的时候,实际上就是调用构造函数并在每次解析的时候都会重新读取并创建一新的函数对象,由此可见当在循环体中调用这样的函数的时候会是十分的低效的,还有一点就是,当我们使用其创建一个函数对象的时候,其并不遵循典型的作用域,而是一直作为*函数来执行的。意思就是,当在函数内部调用它的时候,其实他并不会用函数内部定义的变量。而是只能使用全局变量。
在使用第一和第三种的方法来说的话,在第一次解析的时候会通过new Function来定义一个函数的对象,并把这一对象作为内部对象来进行存储和运行。由此可知在js中每写一个函数,实际上就是在其中存储一个相关的函数对象,并在我们需要调用的时候对其进行调用。
目前最长使用的是var声明和function声明即上述的第一三中方法:
先说两者的显著区别:
第一种声明方式也就是var声明方式, 函数只有在var语句声明之后才能被调用
第二种声明方式也就是function声明方式, 函数可以在function声明之前被调用
这是因为,
对第一种情况, 函数表达式是在函数运行阶段才赋值给变量h
对第二种情况, 函数表达式是在代码运行阶段之前, 也就是代码解析阶段才赋值给标识符h
举例:
第一种:
var h = function () {
// h
}
console.log(h)
h = function () {
// h1
}
输出:
ƒ h() {
// h
}
因为赋值发生在代码运行阶段, 代码自上而下运行console.log(h)所在位置只能获取它之前的赋值
第二种:
function h() {
// h
}
console.log(h)
function h() {
// h1
}
输出:
ƒ h() {
// h1
}
因为赋值发生在代码解析阶段, 代码运行到console.log(h)时解析早已完成, 而解析的结果是后面那个函数h, 故会打印此结果。
总结:
1. 函数表达式: 即上面第一种方式, 这种方法使用function操作符创建函数, 表达式可以存储在变量或者对象属性里. 函数表达式往往被称为匿名函数, 因为它没有名字. 证明这一点你可以 console.log(h.name); 可以看到打印为空 ""
2. 函数声明: 即上面第二种方式, 会声明一个具名函数, 且函数能在其所在作用域的任意位置被调用, 其创建的函数为具名函数, 证明这一点你可以 console.log(h.name); 可以看到打印为 "h". 可在后面的代码中将此函数通过函数名赋值给变量或者对象属性
3. Function()构造器: 不推荐这种用法, 容易出问题
ps:回到文初的问题,返回值赋值方法未成功的主要是未使用函数声明的方式定义function.建议在逻辑简单的脚本中使用函数表达式方法声明,减少编译时间,内存压力。逻辑复杂的脚本,则是在必要时使用函数声明方式,大体上还是使用表达式方式。构造器方法尽量不要使用,使用不当会出现很多问题。
上一篇: 前端开发之js基础(3)
下一篇: cdn方式引入外部的js库