1. 函数声明和函数表达式有什么区别
- 使用function关键字声明一个函数时,声明不必放到调用的前面。
//函数声明 function sayHello(){ console.log('hello') } //函数调用 sayHello()
函数表达式是把一个匿名函数function()赋给一个变量,声明必须放到调用的前面。
//函数声明 var sayHello = function(){ console.log('hello'); } //函数调用 sayHello()
- 函数声明必须有标识符,也就是常说的函数名,函数表达式可以省略函数名。
- 用函数声明创建的函数可以随时调用,而用函数表达式创建的函数是在运行时进行赋值,且要等到表达式赋值完成后才能调用。
2. 什么是变量的声明前置?什么是函数的声明前置
- 在一个作用域下,var 声明的变量和function 声明的函数会前置
console.log(a);
//undefined
var a = 3; console.log(a);
//3
sayHello(); function sayHello(){ console.log('hello'); }
执行顺序为:
var a function sayHello() console.log(a)
//undefined
a = 3 console.log(a)
//3
sayHello()
- 函数内部的声明前置。
var a = 1; function main() { console.log(a); var a = 2; } main()
输出undefined,函数的执行顺序如下,变量声明被提前了。
var a = 1; function main() { var a; console.log(a);
//此时a为undefined
a = 2; }
- 解析器在向执行环境加载数据时,会率先读取函数声明,并使其在执行任何代码之前可用,所以存在函数声明提升,对代码求值的时候,js引擎在第一遍会声明函数并将它们放到源代码树的顶部,所以即使调用函数的语句在声明函数的前面也能正常执行。但是对于函数表达式,它必须等到解析器执行到它所在的代码行,才会真正被解释执行。
3. arguments 是什么
arguments是一个类数组对象,在函数内部,可以使用arguments对象获取到该函数的所有传入参数。
4. 函数的"重载"怎样实现
JS没有重载! 同名函数会覆盖。 但可以在函数体针对不同的参数调用执行相应的逻辑。例如:
function printPeopleInfo(name, age, sex){ if(name){ console.log(name); } if(age){ console.log(age); } if(sex){ console.log(sex); } } printPeopleInfo('Byron', 26); printPeopleInfo('Byron', 26, 'male');
可以在函数体内部使用if语句,来根据传递的参数,执行不同的语句,来模拟函数的重载。
5. 立即执行函数表达式是什么?有什么作用
表达式:(function(){ }
)();
立即执行函数就是,声明一个匿名函数,马上调用这个匿名函数。立即执行函数可以创建一个独立的作用域,这个作用域里面的变量,外面访问不到(即避免变量污染)。
6. 求n!,用递归来实现
function factor(n){ if(n === 1) { return 1 } return n * factor(n-1) } factor(5)
n=5
7. 以下代码输出什么?
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, '男');
getInfo('小谷', 3);
getInfo('男');
function getInfo(name, age, sex) { console.log('name:',name); console.log('age:', age); console.log('sex:', sex); } getInfo('饥人谷', 2, '男');
结果://name: 饥人谷 age: 2 sex: 男
getInfo('小谷', 3);
结果://name: 小谷 age: 3 sex: undefined
getInfo('男');
结果://name: 男 age: undefined sex: undefinedfunction getInfo(name, age, sex) { console.log(arguments); } getInfo('饥人谷', 2, '男');
结果:类数组 ["饥人谷", 2, "男"]
getInfo('小谷', 3);
结果:类数组 ["小谷", 3]
getInfo('男');
结果:类数组 ["男"]function getInfo(name, age, sex) { arguments[0] = 'valley'; console.log('name', name); } getInfo('饥人谷', 2, '男');
结果:name valley
getInfo('小谷', 3);
结果:name valley
getInfo('男');
结果:name valley
8. 写一个函数,返回参数的平方和?
function sumOfSquares(num1,num2,num3) { sum = num1*num1+num2*num2+num3*num3; return sum; } var result = sumOfSquares(2,3,4); console.log(result)
//29function sumOfSquares(num1,num2) { sum = num1*num1+num2*num2; return sum; } var result2 = sumOfSquares(1,3); console.log(result2)
//10
9. 如下代码的输出?为什么
console.log(a);
//结果:undefined
var a = 1;
console.log(b);
//结果:报错,b没有定义。
因为变量声明会前置,实际顺序如下:
var a console.log(a); a = 1; console.log(b);
10. 如下代码的输出?为什么
sayName('world');
//结果:hello world
sayAge(10);
//结果:报错,sayAge不是一个函数。
function sayName(name){ console.log('hello ', name); } var sayAge = function(age){ console.log(age); };
因为函数声明会前置,但函数表达式只会在执行时才会运行函数,实际顺序如下:
function sayName(name){ console.log('hello ', name); }
//声明函数
var sayAge
//声明变量
sayName("name")
//调用函数
sayAge(10);
// 调用函数,但按顺序函数还未声明。
sayAge = function(age){ console.log(age); };
11. 如下代码输出什么? 写出作用域链查找过程伪代码
var x = 10 bar() function foo() { console.log(x) } function bar(){ var x = 30 foo() }
结果:10
作用域链查找过程:
globalContext { AO: { x: 10, foo: function bar: function }, Scope: null }
//foo.[[scope]] = globalContext.AO
//bar.[[scope]] = globalContext.AO
barContext { AO: { x: 30 foo: function }, Scope: bar.[[scope]] }
fooContext { AO: {}, Scope: foo.[[scope]] }
console.log(x)先从foo 执行上下文中的AO里找,找不到再从foo的[[scope]]里找,找到后即调用,所以 console.log(x)是 10
12. 如下代码输出什么? 写出作用域链查找过程伪代码
var x = 10; bar() function bar(){ var x = 30; function foo(){ console.log(x) } foo(); }
结果:30
作用域链查找过程:
globalContext { AO: { x: 10 bar: function }, Scope: null } //bar.[[scope]] = globalContext.AO barContext { AO: { x: 30 foo: function }, Scope: bar.[[scope]] } //foo.[[scope]] = barContext.AO fooContext { AO: {}, Scope: foo.[[scope]] }
console.log(x)先从foo 执行上下文中的AO里找,找不到再从foo的[[scope]]里找,即是bar的执行上下文,所以 console.log(x)是 30
13. 以下代码输出什么? 写出作用域链的查找过程伪代码
var x = 10; bar() function bar(){ var x = 30; (function (){ console.log(x) })() }
结果:30
作用域链的查找过程:
globalContext { AO: { x: 10 bar: function }, Scope: null } //bar.[[scope]] = globalContext.AO barContext { AO: { x: 30 function: function }, Scope: bar.[[scope]] } //function.[[scope]] = barContext.AO functionContext { AO: {}, Scope: function.[[scope]] }
console.log(x)先从function 执行上下文中的AO里找,找不到再从function的[[scope]]里找,即是bar的执行上下文,所以 console.log(x)是 30
14. 以下代码输出什么? 写出作用域链查找过程伪代码
var a = 1; function fn(){ console.log(a) //仅声明,未赋值,undefined var a = 5 console.log(a) //赋值为5 a++ //自增变为6 var a
fn3()
//先执行fn3里的console.log(a),为1
fn2()
//再执行fn2里的console.log(a),为6
console.log(a)
//经过fn2,a变为20
function fn2(){ console.log(a) //即fnContext.AO = globalContext.AO中的a a = 20 } }
function fn3(){
console.log(a)
//即globalContext.AO中的a
a = 200
//globalContext.AO中的a变为200
}
fn()
console.log(a)
//调用globalContext.AO中的a = 200
结果:
作用域链的查找过程:
globalContext { AO: { x: 1 fn: function fn3: function }, Scope: null } //fn.[[scope]] = globalContext.AO //fn3.[[scope]] = globalContext.AO fnContext { AO: { x: 1
//之后a赋值5,再之后a++
fn2: function }, Scope: fn.[[scope]] //即globalContext.AO } //fn2.[[scope]] = fnContext.AO fn3Context { AO: { }, Scope: fn3.[[scope]]
//即globalContext.AO
}
结果:
undefined
5
1
6
20
200