🦄 2024 独立开发者训练营,一起创业!查看介绍 / 立即报名(剩余8个优惠名额) →

博客

JavaScript Functional Programming:高阶函数 Higher order functions

高阶函数(higher-order functions),就是返回其它函数的函数,或者使用其它函数作为它的参数的函数。

使用函数作为参数

因为函数本身就是一个值,所以可以让函数作为参数传递给其它的函数。JavaScript 有些函数就需要用到函数类型的参数,比如 Array.map。

比如我有一组数据:

const names = ['小猫', '小狗', '小刺猬']

我要分别问候一下这组数据里的每个项目:

const greetings = names.map(function(name) {
  return `hi ~ ${name}`
})

console.log(greetings)
// ["hi ~ 小猫", "hi ~ 小狗", "hi ~ 小刺猬"]

上面的 map 方法里用了一个匿名函数作为它的参数。在这个函数里面,我们在数组里的每个项目的前面都加上了一个 “hi ~” ,map 会返回一个新的数组,这个数组我交给了 greetings 变量。

JavaScript Functional Programming:声明式与命令式

函数式编程属于声明式编程(declarative programming)的范畴,经常跟声明式编程一块儿讨论的是命令式编程(imperative programming),因为它们是两种不太一样的风格。

命令式编程一般就是说清楚具体要怎么样得到一个结果:先这样做,再这样做,然后再这样,如果这样,就这样做 ...  声明式编程就是声明(说明)一下你想得到的结果是什么样的:把这组电影里的平均分大于 9 分的电影过滤出来给我。

比如有一组电影,你想过滤出评分 9 分以上的电影。

let movies = [
  { title: 'The Shawshank Redemption', rating: 9.6 },
  { title: 'Forrest Gump', rating: 9.4 },
  { title: 'Roman Holiday', rating: 8.9 }
]

第 12 周课程与内容简报

JavaScript 函数式编程系列博客,更新了定制 Drupal 界面的课程,新发布了 Socket.io 的使用课程。

JavaScript Functional Programming:纯函数

函数式编程鼓励我们多创建纯函数(pure functions),纯函数只依赖你交给它的东西,不使用任何函数以外的东西,也不会影响到函数以外的东西。跟纯函数对应的就是不纯函数(impure functions),也就是不纯函数可能会使用函数以外的东西,比如使用了一个全局变量。也可能会影响到函数以外的东西,比如改变了一个全局变量的值。

多使用纯属函数是因为它更可靠一些,也没什么副作用(side effects)。你交给它同样的值,它每次都会给你输出同样的结果,这种特质叫所指透明(Referential transparency) 。这会让程序更稳定,也更容易测试。

副作用

纯函数没副作用,有副作用的函数都不纯。我吃了一片感冒药,是要治我的感冒,但副作用是它让我想睡觉。函数的副作用多数表现为函数依赖或者改变了它以外的东西。

看个例子:

let name = 'ninghao'
const greet = () => {
  console.log(`hello, ${name}`)
}

greet 不是纯函数,因为这个函数依赖函数以外的东西,这里就是全局作用域下的 name。这样做的问题是,函数依赖的 name 很可能在应用运行的时候发生变化,这样试一下:

JavaScript Functional Programming:作用域

全局作用域

打开一个 js 文件,写了一行代码,这行代码所在的位置就会是全局作用域(global scope)。比如:

var name = '狗狗'

局部作用域

全局作用域只有一个,在全局使用域里面定义的其它的作用域都被称为局部作用域(local scope)。局部作用域是由函数创建的,每个函数都会创建一个局部作用域。

下面我创建了一个名字是 greet 的函数,在它里面声明了一个 name 变量,这个变量是在局部作用域之内。

// 作用域 A: 全局作用域

var greet = function() {
  // 作用域 B:局部作用域
  // 这里是由 greet 这个函数创建的局部作用域

  var name = '猫咪'
}

在这个局部作用域里面定义的东西,在这个作用域的外面是访问不到的。试一下:

JavaScript Functional Programming:定义函数的几种方法

在 JavaScript 语言里,函数是一种对象,所以可以说函数是 JavaScript 里的一等公民(first-class citizens)。

之前我们这样定义过一个函数:

function greet(greeting, name) {
  return `${greeting}, ${name}`
}

因为在 JavaScript 里面是对象(object),所以它会有一些属性还有方法。比如 name 属性是函数的名字,length 属性指的是函数里面有多少个必须要传递的参数。比如访问上面定义的这个函数里的两个属性:

greet.name
// 输出 greet

greet.length
// 输出 2,表示有两个参数

函数都是 Function 的实例,所以你可以访问 Function 上定义的属性:name,length,可以使用方法:apply(),call()。可以这样证明:

JavaScript Functional Programming:函数

Functional Programming,函数式编程。是一套编写程序的方法,也可以说是一种风格。

函数

先了解一下什么是 Function,函数。来看一行代码:

console.log('hello ~')

执行上面代码会在控制台上输出一个 “hello ~”,每次你想在控制台上输出一个 “hello ~”,你都要执行一下上面这行代码。我们可以用一个函数包装一下这行代码:

function greet() {
  console.log('hello ~')
}

定义函数可以使用 function 这个关键词,上面我们定义了一个名字是 greet(问候的意思) 的函数。执行 / 调用这个函数,就会在控制台上输出一个 “hello ~”,因为这是这个函数要做的事情。调用函数可以在函数的名字的后面加上一组括号(),像这样:

greet()

在我们的程序里,可以重复使用这个函数。

参数

让函数更灵活一点,可以在定义它的时候去设置一些它能接受的参数,这些参数你可以在函数的内部去使用,在调用函数的时候,你可以指定函数的参数的值。像这样再改进一下 greet 这个函数:

第 11 周课程与内容简报

这礼拜给您准备了 Express 框架的使用,再了解一下 Windows 平台上的工作流程,还有继续了解自定义 Drupal 界面的方法。

更新

Drupal:自定义界面

继续了解自定义 Drupal 界面的方法。

  • 找到需要的 template,hook 还有 API
  • 在本地动作链接上添加 CSS 类:template_preprocess_menu_local_action
  • 去掉元素上不需要的 CSS 类
  • 禁用 Library里定义的资源

新的

Express

用 Express 框架创建一个小应用,快速了解一下这个框架的使用方法。

我的工作流程:Windows

我把自己在 macOS 平台上的工作流程,转换成了一套也可以在 Windows 平台上使用的方法。

cmder:Windows 上的终端工具

cmder

在宁皓网的课程视频里我经常会说,打开命令行工具,或者打开终端(Terminal)。在 Windows 系统上,应该就是打开 cmd 或者 powershell。最近朋友推荐了一款更好用的命令行工具,叫 cmder。强烈推荐 Windows 平台用户都试一下这个 cmder。

这款工具的使用已经包含在了:《我的工作流程:Windows》。

Windows 上缺少的工具

Windows 与 Unix,Linux,macOS  不是一路的。Linux,像 CentOS,Ubuntu,还有 macOS,他们其实都有一些血源关系。你会发现很多操作都比较类似,文本与目录的权限的管理也都差不多,很多工具也都可以通用。

我们平时的开发工作,经常需要用到一些 Unix 工具。比如你要登录到 Linux 服务器,你需要使用 ssh 。但是,在 Windows 上默认是没有这些工具的。cmder 里面包含了几乎所有这些工具。所以,通过 cmder ,你可以直接在 Windows 系统上使用 ssh 登录到你的 Linux 系统的服务器,不再需要其它的特殊工具,比如之前我会推荐你用 putty 工具登录服务器。

宁皓网的学习路径:零基础第二阶段

第二阶段课程推荐完成期限:14 天 。在第二阶段我们要了解一款编辑器,这是你以后工作的主要工具,可以选择的编辑器非常多,一开始,我推荐大家不要在选择工具上花费太多时间,选择一款自己已经熟悉的,或者我推荐的这款编辑器,名字是 Atom。开源,可扩展,可定制,是一款现代的编辑器。

然后需要再学一下版本控制工具,名字是 Git。这是以后设计,开发,协作必备的工具,一定要学会。推荐一开始,了解 Git 在命令行下的操作。它也有图形界面,比如 Github 与 Bitbucket 都提供了图形界面的 Git 版本控制工具。

接着再学两门标记语言,HTML 与 CSS,这是网页设计的基础。非常简单,只需要记住标记的名字,使用方法,与规则就行了。没有复杂的逻辑,不需要多想,只需要理解,记住也不是必须的,只要理解就行。忘了标记的名字,记不清 CSS 属性的名字与用法都可以去搜索一下。你只需要知道自己具体要搜索什么就行了。

任务一:编辑器

编辑器,下载 Atom 编辑器。学会打开文件与目录,知道在哪里做基本的设置,安装插件与主题。一开始不用成为编辑器专家,了解个基础,能正常工作就行了。以后慢慢完善你的编辑技巧 :)

推荐 1 天完成,最多用两天时间。

微信好友

用微信扫描二维码,
加我好友。

微信公众号

用微信扫描二维码,
订阅宁皓网公众号。

240746680

用 QQ 扫描二维码,
加入宁皓网 QQ 群。

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点