JS经典面试题记录

题目代码：

function Foo() {
    getName = function () {
        console.log(1)
    }
    return this
}
Foo.getName = function () {
    console.log(2)
}
Foo.prototype.getName = function () {
    console.log(3)
}
var getName = function () {
    console.log(4)
}
function getName() {
    console.log(5)
}
Foo.getName()           // 2
getName()               // 4
Foo().getName()         // 1
getName()               // 1
new Foo.getName()       // 2
new Foo().getName()     // 3
new new Foo().getName() // 3

关于上题的解释：

函数1：定义一个有返回值的构造函数

函数2：构造函数的一个属性getName指向一个匿名函数

函数3：构造函数的原型上有个getName方法

函数4：定义一个变量getName指向一个匿名函数

函数5：声明一个叫getName的具名函数

匿名函数：

定义：没有实际名字的函数。

创建一个匿名函数：写一个有名字的函数，然后去掉名字，添加括号。

//匿名函数在其它应用场景括号可以省略
(function (){
    //由于没有执行该匿名函数，所以不会执行匿名函数体内的语句
    console.log("我是匿名函数，不会输出到控制台。")
})

//如果需要执行匿名函数，在匿名函数后面加上一个括号即可立即执行！
(function (){
    console.log("我是匿名函数，会输出到控制台哦！")
})()
//如果需要传值，可以在括号中传值
(function (str){
    console.log(str)
})("我是匿名函数，会输出到控制台哦！")

使用场景：

1、绑定事件，如点击事件。DOM.onclick = function(){}

2、用于对象定义，如：

var obj = {
    a: '0',
    b: function() {
        return '内容'
    }
}

3、函数表达式，如：

//将匿名函数赋值给变量fn。
var fn=function(){
    return "我是匿名函数"
}
//调用方式与调用普通函数一样
console.log(fn()) // 输出：“我是匿名函数”

4、回调函数，常用语定时执行函数，如：

setInterval(function(){
    console.log("我是一个回调函数，每次1秒钟会被执行一次")
},1000)

5、作为返回值，如：

function getName(){
    //返回匿名函数
    return function(){
        return "张三"
    }
}
// 调用匿名函数方法：
// 第一种
console.log(getName()())
// 第二种
var name = getName()
console.log(name())

匿名函数的作用：

1、实现闭包。

2、模拟块级作用域，减少全局变量。（在多人协作的时候，可避免命名问题。）

闭包

闭包就是一个函数，这个函数能够访问其他函数的作用域中的变量。

function demo1(){
    var a = 100
    var demo2 = function(){
        cosole.log(a)
    }
    return demo2
}
// demo2就是一个闭包函数，它能够访问到demo1函数的作用域

 

闭包与声明提升，点击这里。

自执行函数，更多点击这里。

方式1 ：小括号将要执行的函数包裹住

// 方式一
(function demo1(){
    console.log(1);
}()); // 输出1
// 方式二
(function demo2(){
    console.log(2);
})(); // 输出2

方式2 ：符号

// 方式一： && 与操作
true && function () { console.log("true &&") } ();

// 方式二： || 或操作
false || function () { console.log("true ||") } ();

// 方式三： , 逗号
0, function () { console.log("0,") } (); 

// 方式四： 还有一元操作符（! ~ - + ）
!function () { console.log("!"); } (); //"!"
~function () { console.log("~"); } (); //"~"
-function () { console.log("-"); } (); //"-"
+function () { console.log("+"); } (); //"+"

// 方式五： 赋值符号 =
//此处 要注意区分 i 和 j 不同之处。前者是函数自执行后返回值给 i ；后者是声明一个函数，函数名为 j
var i = function () { console.log("output i:"); return 10; } (); // "output i:"
var j = function () { console.log("output j:"); return 99;}
console.log(i); // 10
console.log(j); // ƒ () { console.log("output j:"); return 99;}
// 也可以写成这样
var i2 = (function () { console.log("output i2:"); return 10; } ()); // "output i2:"
    var i3 = (function () { console.log("output i3:"); return 10; }) (); // "output i3:"


// 方式六： new关键字
// 注意：采用new方式，可以不要再解释花括弧 `}` 后面加小括弧 `()` 
new function () {
    console.log("new");
} //"new"
new function (a) {
    console.log(a);
} ("new"); //"new"

当闭包与自执行函数放在一起的时候，该如何分析？点击这里

例子：setTimeout与fn()匿名函数放在一起