函数与函数式编程

Tue, 01 Oct 2024 00:00:00 +0800

纵观JavaScript中所有必须需要掌握的重点知识中，函数是我们在初学的时候最容易忽视的一个知识点。在学习的过程中，可能会有很多人、很多文章告诉你面向对象很重要，原型很重要，可是却很少有人告诉你，面向对象中所有的重点难点，几乎都与函数息息相关。

包括之前几篇文章介绍的执行上下文，变量对象，闭包，this等，都是围绕函数的细节来展开。

很多人在学习中，很急切的希望自己快一点开始学习面向对象，学习模块，学习流行框架，然后迅速成为高手。但是我可以很负责的告诉你，关于函数的这些基础东西没理解到一定程度，那么你的学习进展一定是举步维艰的。

所以，大家一定要重视函数！

当然，关于函数的重点，难点在前面几篇文章都已经说得差不多了，这篇文章主要总结一下函数的基础知识，并初步学习函数式编程的思维。

一、函数声明、函数表达式、匿名函数与自执行函数

关于函数在实际开发中的应用，大体可以总结为函数声明、函数表达式、匿名函数、自执行函数。

函数声明

我们知道，JavaScript中，有两种声明方式，一个是使用var的变量声明，另一个是使用function的函数声明。

在前端基础进阶（三）：变量对象详解中我有提到过，变量对象的创建过程中，函数声明比变量声明具有更为优先的执行顺序，即我们常常提到的函数声明提前。因此我们在执行上下文中，无论在什么位置声明了函数，我们都可以在同一个执行上下文中直接使用该函数。

fn(); // function

function fn() {
 console.log('function');
}

函数表达式

与函数声明不同，函数表达式使用了var进行声明，那么我们在确认他是否可以正确使用的时候就必须依照var的规则进行判断，即变量声明。我们知道使用var进行变量声明，其实是进行了两步操作。

// 变量声明
var a = 20;

// 实际执行顺序
var a = undefined; // 变量声明，初始值undefined，变量提升，提升顺序次于function声明
a = 20; // 变量赋值，该操作不会提升

同样的道理，当我们使用变量声明的方式来声明函数时，就是我们常常说的函数表达式。函数表达的提升方式与变量声明一致。

fn(); // 报错
var fn = function() {
 console.log('function');
}

上例子的执行顺序为：

var fn = undefined; // 变量声明提升
fn(); // 执行报错
fn = function() { // 赋值操作，此时将后边函数的引用赋值给fn
 console.log('function');
}

因此，由于声明方式的不同，导致了函数声明与函数表达式在使用上的一些差异需要我们注意，除此之外，这两种形式的函数在使用上并无不同。

关于上面例子中，函数表达式中的赋值操作，在其他一些地方也会被经常使用，我们清楚其中的关系即可。

在构造函数中添加方法
function Person(name) {
 this.name = name;
 this.age = age;
 // 在构造函数内部中添加方法
 this.getAge = function() {
 return this.age;
 }
 this.
}
// 给原型添加方法
Person.prototype.getName = function() {
 return this.name;
}

// 在对象中添加方法
var a = {
 m: 20,
 getM: function() {
 return this.m;
 }
}

匿名函数

函数与函数式编程 on Last Stand

函数与函数式编程

一、函数声明、函数表达式、匿名函数与自执行函数