一、函数声明和函数表达式有什么区别
- 区别：
用函数声明创建的函数可以在定义之前就进行调用；而用函数表达式创建的函数不能在被赋值之前进行调用。 - 原因
函数声明语句“被提前”到外部脚本或外部函数作用域的顶部，所以以这种方式声明的函数，可以被在它定义之前出现的代码所调用。
而要使用一个以表达式方式定义的函数之前，必须把它赋值给一个变量。变量的声明提前了，但给变量赋值是不会提前的，所以，以表达式方式定义的函数在定义之前无法调用。
二、什么是变量的声明前置？什么是函数的声明前置？
- 变量声明前置：
javascript的变量声明具有hoisting机制，JavaScript引擎在执行的时候，会把所有变量的声明都提升到当前作用域的最前面。
var a = 1;
function main() {
console.log(a);
var a = 2;
}
main()//输出undefined
//解析如下
function main() {
var a;
console.log(a);
a = 2;
}
main()
//所以输出undefined```
* 函数的声明前置
JavaScript的函数作用域是指在函数内声明的所有变量在函数体内是始终可见的。这意味着变量可以先使用，后声明。JavaScript的这一特性被非正式地称为声明提前（hoiosting），即JavaScript函数中所有变量的声明都被“提前”至函数体的顶部。
>```
var scope = "global";
function f() {
console.log(scope);//输出underfined，而不是"global"
var scope = "local"; //变量在这里赋初始值，但变量在函数体内任何地方均是有定义的。
console.log(scope);//输出"local"
}
//上述过程等价于：将函数内的变量声明提前至函数顶部，但变量初始化（赋值）还在原来的位置。
var scope = "global";
function f() {
var scope；//在函数顶部声明了局部变量
console.log(scope);//变量存在，但值是underfined
scope = "local"; //初始化赋值
console.log(scope);//
}```
三、arguments 是什么
标识符arguments是指向实参对象的引用，实参对象是一个类数组对象（不能修改它，也不能用push来添加新元素等。但是可以访问其中的元素，并且同时具有.length属性）。
在函数代码中，使用特殊对象 arguments，无需明确指出参数名，就能访问它们。
例如，在函数 sayHi() 中，第一个参数是 message。用 arguments[0] 也可以访问这个值，即第一个参数的值（第一个参数位于位置 0，第二个参数位于位置 1，依此类推）。
四、函数的"重载"怎样实现
所谓重载，是同一函数名，但是参数类型或参数个数不同的函数。
Javascript不像其他编程语言一样具有函数签名（函数签名,简单的说就是函数的接收参数类型和参数个数）。所以Javascript是不能像其他语言一样实现方法名相同，参数个数不同的这类重载的。
利用arguments，可以实现JavaScript的重载。
> function showMessage(){
if(arguments.length==1){
console.log(arguments[0]);
}else if( arguments.length==2){
console.log(arguments[0]+"说:"+arguments[1]);
}else{
return false;
}
}
showMessage("Hi!");
showMessage("张三","Hi 你妹");
五、立即执行函数表达式是什么？有什么作用
立即执行函数就是当我们在定义了函数之后需要立即执行的函数。
( function(){…} ) ()
( function (){…} () )```
是两种javascript立即执行函数的常见写法。
-
为什么这么写：
首先，要在函数体后面加括号就能立即调用，这个函数必须是函数表达式，不能是函数声明。
下面代码：
function(){ /* code */ }(); // SyntaxError: Unexpected token```
报错了，这是为何？这是因为在javascript代码解释时，当遇到function关键字时，会默认把它当做是一个函数声明，而不是函数表达式，如果没有把它显视地表达成函数表达式，就报错了，因为函数声明需要一个函数名，而上面的代码中函数没有函数名。（以上代码，也正是在执行到第一个左括号(时报错，因为(前理论上是应该有个函数名的。）
如果我们给它函数名，然后加上()立即调用，同样也会报错:
function foo(){ /* code */ }(); // SyntaxError: Unexpected token```
为什么会这样？在一个表达式后面加上括号，表示该表达式立即执行；而如果是在一个语句后面加上括号，该括号完全和之前的语句不搭嘎，而只是一个分组操作符，用来控制运算中的优先级（小括号里的先运算）。所以以上代码等价于：
function foo(){ /* code */ }
(); // SyntaxError: Unexpected token )```
相当于先声明了一个叫foo的函数，之后进行()内的表达式运算，但是()（分组操作符）内的表达式不能为空，所以报错。
( function(){…} ) ()
( function (){…} () )```
为什么这样就能立即执行并且不报错呢？因为在javascript里，括号内部不能包含语句，当解析器对代码进行解释的时候，先碰到了()，然后碰到function关键字就会自动将()里面的代码识别为函数表达式而不是函数声明。
-
作用：
1. 创建只使用一次的函数，并立即执行它。
2. 创建闭包，保存状态，隔离作用域。
3. 作为独立模块存在(例子如jQuery)，防止命名冲突，命名空间注入(模块解耦)。
六、求n!，用递归来实现
function recursion(n) {
if (n===1) {
return 1;
}else {
return n * recursion(n-1);
}
}
七、以下代码输出什么？
function getInfo(name, age, sex){
console.log('name:',name);
console.log('age:', age);
console.log('sex:', sex);
console.log(arguments);
arguments[0] = 'valley';
console.log('name', name);
}
getInfo('饥人谷', 2, '男');
/*输出
name: 饥人谷
age: 2
sex: 男
['饥人谷',2,'男']
name valley
*/
getInfo('小谷', 3);
/*
name: 小谷
age: 3
sex: undefined
['小谷',3]
name valley
*/
getInfo('男');
/*
name: 男
age: undefined
sex: undefined
['男']
name valley
*/
八、写一个函数，返回参数的平方和？
function sumOfSquares(){
var sum=0;
for(var i=0;i<arguments.length;i++){
sum=sum+arguments[i]*arguments[i];
}
console.log(sum);
}
var result = sumOfSquares(2,3,4)
var result2 = sumOfSquares(1,3)
console.log(result) //29
console.log(result) //10
九、如下代码的输出？为什么
console.log(a);
var a = 1;
console.log(b);
以上可重写为：
var a；//声明前置
console.log(a);//输出underfined
a = 1;
console.log(b);//ReferenceError: b is not defined
十、如下代码的输出？为什么
sayName('world');//输出hello world，函数声明前置
sayAge(10);//ReferenceError: sayAge is not defined
function sayName(name){
console.log('hello ', name);
}
var sayAge = function(age){
console.log(age);
};
十一、如下代码输出什么? 写出作用域链查找过程伪代码
var x = 10
bar()
function foo() {
console.log(x)
}
function bar(){
var x = 30
foo()
}
//输出10
/*
1. globalContext = {
AO: {
x: 10
foo: function
bar: function
}
Scope: null
}
foo.[[Scope]] = globalContext.AO
bar.[[Scope]] = globalContext.AO
//调用 bar()
2. barContext = {
AO: {
x: 30
}
Scope: globalContext.AO
}
//调用 foo()
3. fooContext = {
AO: {}
Scope: globalContext.AO
}
*/
十二、如下代码输出什么? 写出作用域链查找过程伪代码
var x = 10;
bar()
function bar(){
var x = 30;
function foo(){
console.log(x)
}
foo();
}
//输出30
/*
1. globalContext = {
AO: {
x: 10
bar: function
}
Scope: null
}
bar.[[Scope]] = globalContext.AO
//调用 bar()
2. barContext = {
AO: {
x: 30
foo: function
},
Scope: globalContext.AO
}
foo.[[Scope]] = barContext.AO
//调用 foo()
3. fooContext = {
AO: {}
Scope: barContext.AO
}
*/
十三、以下代码输出什么? 写出作用域链的查找过程伪代码
var x = 10;
bar()
function bar(){
var x = 30;
(function (){
console.log(x)
})()
}
//输出30
/*1.
globalContext = {
AO:{
x:10
bar:function
}
Scope: null
}
bar.[[scope]] = globalContext.AO
2.调用bar()
barContext = {
AO:{
x:30
function
}
Scope:bar.[[scope]] = globalContext.AO
}
function.[[scope]] = barContext.AO
3.调用立即执行函数
functionContext = {
AO:{}
Scope:function.[[scope]] = barContext.AO
}
*/
十四、以下代码输出什么？ 写出作用域链查找过程伪代码
var a = 1;
function fn(){
console.log(a)
var a = 5
console.log(a)
a++
var a
fn3()
fn2()
console.log(a)
function fn2(){
console.log(a)
a = 20
}
}
function fn3(){
console.log(a)
a = 200
}
fn()
console.log(a)
重写为：
var a;
function fn(){
var a; //3.声明fn()的局部变量a
var a;
function fn2(){ //4.声明fn2()
console.log(a);//13.fn2()未定义变量a，寻找父级，输出6
a=20; //14.把fn()的a赋值为20
}
console.log(a); //5.未赋值输出underfined
a=5; //6.为fn()的局部变量a赋值为5
console.log(a); //7.输出5
a++; //8.a=6
fn3() //9.调用fn3()
fn2() //12.调用fn2()
console.log(a) //15.输出20
}
function fn3(){
console.log(a); //10.fn3()的作用域未定义变量a，寻找父级，输出1
a=200 //11.将全局a赋值为200
}
a=1; //1.全局变量a赋值为1
fn() //2.调用fn()
console.log(a) //16.输出200
//输出
undefined
5
1
6
20
200
/*
1. globalContext = {
AO: {
a: 1 -> 200
fn: function
fn3: function
},
Scope: null
}
fn.[[Scope]] = globalContext.AO
fn3.[[Scope]] = globalContext.AO
//调用 fn()
2. fnContext = {
AO: {
a: undefined -> 5 -> 6 -> 20
fn2: function
}
Scope: globalContext.AO
}
fn2.[[Scope]] = fnContext.AO
//调用 fn3()
3. fn3Context = {
AO: {}
Scope: globalContext.AO
}
//调用 fn2()
3. fn2Context = {
AO: {}
Scope: fnContext.AO
}
*/
