1. 函数声明和函数表达式有什么区别?
- 函数声明：可以定义命名的函数变量，而无需给变量赋值
function fn() {
console.log('happy')
}
- 函数表达式：将函数定义为表达式语句（通常是变量赋值）的一部分。
var fn =function() {
console.log('happy')
}
- 区别：JavaScript 解释器中存在一种变量声明被提升（hoisting）的机制，也就是说变量（函数）的声明会被提升到作用域的最前面，即使写代码的时候是写在最后面，也还是会被提升至最前面；而函数表达式在使用前必须先赋值，所以声明必须放在调用前面。
console.log(fn); //ƒ fn() {}
console.log(fn2); //undefined
function fn() {}
var fn2 = function () {}
console.log(fn); //ƒ fn() {}
console.log(fn2); //ƒ () {}
2. 什么是变量的声明前置，什么是函数的声明前置？
- 变量的声明前置：使用var关键字可以声明一个变量，声明变量的作用域限制在其声明位置的上下文中，而未声明变量总是全局的，所以总在作用域最开始声明变量可以使变量的作用域变得清晰。
console.log(a);
var a = 2;
console.log(a);
解析为：
var a;
console.log(a); //undefined
a = 2;
console.log(a); //2
- 函数的声明前置：使用function关键字可以声明一个函数，它的特征是函数声明提升，执行代码前会先读取函数声明，即函数声明不必放在调用的前面，它可以放在当前作用域的任何位置。
fn();
function fn() {
console.log('happy');
}
解析为：
function fn() {
console.log('happy');
}
fn();
function声明会在代码执行之前就创建、初始化、赋值
- 注意：变量声明和函数声明都会提升，但函数声明提升的优先级高于变量声明提升。
console.log(a);
var a = 2;
function a() {}
解析为：
function a() {}
var a;
console.log (a); //ƒ a() {}
a = 2;
3. arguments 是什么？
- arguments是一个类似数组的对象, 对应于传递给函数的参数。
function fn(name, age, sex) {
console.log(arguments[0]);
console.log(arguments[1]);
console.log(arguments[2]);
console.log(arguments.length);
}
fn('zhou', 23); //zhou, 23, undefined, 2
4. 函数的"重载"怎样实现?
- 函数重载，就是函数名称一样，但是输入输出不一样。或者说，允许某个函数有各种不同输入，根据不同的输入，调用不同的函数，然后返回不同的结果。
- JS中函数名相同的两个函数，后定义的函数会覆盖前面的函数。因此JS没有重载，但是可以在JS中实现重载的功能，通过检查闯入函数中的参数的类型和数量，然后做出不同的反应。
function fn(name, age, sex) {
if(typeof arguments[0] === 'string'){
console.log(name);
}
if(typeof arguments[1] === 'number'){
console.log(age);
}
console.log(arguments[2]);
}
fn('zhou', 23, 'man'); //zhou, 23, man
fn(true, 23, 'man'); //23, man
5. 立即执行函数表达式是什么，有什么作用？
- 在Javascript中，一对圆括号“()”是一种运算符，跟在函数名之后，表示调用该函数。比如，print()就表示调用print函数。有时，我们需要在定义函数之后，立即调用该函数。但是不能直接在函数的定义之后直接加上圆括号。
- JavaScript引擎规定，如果function关键字出现在行首，一律解释成语句。因此，JavaScript引擎看到行首是function关键字之后，认为这一段都是函数的定义，不应该以圆括号结尾，就会报错。
解决方法就是不要让function出现在行首，让引擎将其理解成一个表达式。最简单的处理，就是将其放在一个圆括号里面。
(function fn() {})();
(function fn() {}());
推而广之，任何让解释器以表达式来处理函数定义的方法，都能产生同样的效果
-
通常情况下，只对匿名函数使用这种“立即执行的函数表达式”。
- 一是不必为函数命名，避免了污染全局变量；
- 二是IIFE内部形成了一个单独的作用域，可以封装一些外部无法读取的私有变量。
参考阮一峰-JavaScript标准教程
6. 求n!，用递归来实现
function factorial(n) {
if(n === 0) {
return 1;
}
if(n === 1) {
return 1;
}
return n * factorial(n-1);
}
factorial(6); //720
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('男');
输出分别为：
name: 饥人谷
age: 2
sex: 男
['饥人谷', 2, '男']
name vallery
name: 小谷
age: 3
sex: undefined
['小谷', 3]
name vallery
name: 男
age: undefined
sex: undefined
['男']
name vallery
8. 写一个函数，返回参数的平方和？
function sumOfSquares(){
var sum = 0;
for(var i = 0; i < arguments.length; i++) {
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(result2) //10
9. 如下代码的输出，为什么？
console.log(a);
var a = 1;
console.log(b);
解析为：
var a;
console.log(a); //undefined a变量提升后，暂未赋值
a = 1;
console.log(b); //Uncaught ReferenceError: b is not defined b未声明
10. 如下代码的输出，为什么？
sayName('world');
sayAge(10);
function sayName(name){
console.log('hello ', name);
}
var sayAge = function(age){
console.log(age);
};
解析为：
function sayName(name){
console.log('hello ', name);
}
var sayAge;
sayName('world'); //hello world 函数声明提升
sayAge(10); //Uncaught TypeError: sayAge is not a function //sayAge是函数表达式，在使用前必须先赋值
sayAge = function(age){
console.log(age);
};
11. 如下代码输出什么，写出作用域链查找过程伪代码？
var x = 10;
bar()
function foo() {
console.log(x) //10
}
function bar(){
var x = 30
foo()
}
查找过程伪代码：
globalContent = {
AO = {
x: 10
foo: function
bar: function
}
Scope: null
}
barContent = {
AO = {
x: 30
f00: function
}
Scope: bar.[[scope]] = globalContent.AO
}
fooContent = {
AO = {}
Scope:foo.[[scope]] = globalContent.AO
}
12. 如下代码输出什么，写出作用域链查找过程伪代码？
var x = 10;
bar()
function bar(){
var x = 30;
function foo(){
console.log(x) //30
}
foo();
}
查找过程伪代码：
globalContent = {
AO = {
x: 10
bar: function
}
Scope: null
}
barContent = {
AO: {
x: 30
foo:function
}
Scope: bar.[[scope]] = globalContent.AO
}
fooContent = {
AO: {}
Scope: foo.[[scope]] = barContent.AO
}
13. 如下代码输出什么，写出作用域链查找过程伪代码？
var x = 10;
bar()
function bar(){
var x = 30;
(function (){
console.log(x) //30
})()
}
查找过程伪代码：
globalContent = {
AO = {
x: 10
bar: function
}
Scope: null
}
barContent = {
AO: {
x: 30
}
Scope: bar.[[scope]] = globalContent.AO
}
14. 如下代码输出什么，写出作用域链查找过程伪代码？
var a = 1;
function fn(){
console.log(a) //undefined
var a = 5
console.log(a) //5
a++
var a
fn3()
fn2()
console.log(a) //20
function fn2(){
console.log(a) //6
a = 20
}
}
function fn3(){
console.log(a) //1
a = 200
}
fn()
console.log(a) //200
查找过程伪代码：
globalContent = {
AO : {
a: 1 -> 200
fn: function
fn3: function
},
Scope: null
}
fnContent = {
AO : {
a: undefined -> 5 -> 6 -> 20
fn2: function
}
Scope: fn.[[scope]] = globalContent.AO
}
fn3Content = {
AO : {}
Scope: fn3.[[scope]] = globalContent.AO
}
fn2Content = {
AO : {}
Scope: fn2.[[scope]] = fnContent.AO
}