零、引言

6月2日鸿蒙操作系统的发布如蛟龙出水，好评如潮，国人热切盼望拥有自主开发的操作系统这一国之重器。更在将来能在移动端与安卓和IOS，在PC端与Windows，Linux，MacOS形成鼎力之势。

有诗为证“鸿鹄志远，一举千里；承蒙厚爱，不负期待”。

在“乱花渐欲迷人眼”的喧闹声中，在人人都想要安装鸿蒙系统的呼声中。不妨抽身出来，冷静思考，如何乘着这股东风，如何 能“大鹏一日同风起，扶摇直上九万里”。

这股东风吹来的机会就是“鸿蒙”系统的应用开发。具体而言，鸿蒙的应用开发框架采用的是JavaScrpt作为开发语言。

本文是系列JS课程的第一课。

一、JavaScript 函数式开发入门

JavaScript语言当下不仅是前端开发的唯一语言，更在后端开发，服务器应用等方面攻城略地，此刻更有了得“天时地利”的鸿蒙的加持，可以说是前途无量。

而最令人惊喜的是，JavaScript的著名前端框架REACT正在引领“函数式编程”这门神奇而古老的编程技术的文艺复兴。因此，坊间说法，JS是披着OOP面向对象语言的幌子，却是实打实的FP函数式编程的里子。

如果“面向对象编程”的Java和“面向过程编程”的C是刻板的机器思维模式，那么JavaScript的这一波“函数式编程”，将会把最符合人类直觉思维的编程模式，落实到应用开发之中。

函数式的编程思维从“数组”的操作开始。按照是否为纯函数和是否应用迭代方法，绘制四象限，将数组的所有操作方法归类如下：

二、数组的纯函数操作方法

数组的纯函数操作分为两类，即数组变形(transform)与数组筛选(predicates)。 首先介绍数组变形的6种涉及迭代的方法和3个非迭代的方法：

• 六种需要运行一次迭代的方法

// 1.map
let array = [31, 78, 97, 230];
array.map(x=>Math.sqrt(x));

// 2.reduce
array.reduce((x,y)=>x+y, 0);

// 3.flat
let array2 = ["apple", "orange", "pear", ["banana", "cherry"]];
array2.flat();

// 4.flatMap
array.flatMap(x=>[Math.log2(x)]);

// 5.fill
array.forEach(val=>console.log(val)

// 6.fill
Array(10).fill(0);

• 三种不需要迭代的方法：

> let array = [31, 78, 97, 230]
undefined
> array.join()
'31,78,97,230'
> array.slice(2)
[ 97, 230 ]
> array.concat([4, 5], 19)
[
  31, 78, 97, 230,
   4,  5, 19
]
>

• 函数式的逻辑判断方法

逻辑判断就是从数组中筛选满足条件的元素，单单靠着直觉就能想到find,includes等等。

> // 1.find
> array.find(val=> val>30 && val<100)
31
> // 2.findIndex
> array.findIndex(val=> val>30 && val<100)
0
> // 3.filter
> array.filter(val => val>50 || val < 100)
[ 31, 78, 97, 230 ]
> // 4.includes
> array.includes(230)
true
> // 5.every
> array.every(val => val> 50)
false
> // 6.some
> array.some(val => val > 60)
true
> // 7.indexOf
> array.indexOf(78)
> // 8.lastIndexOf
> array.lastIndexOf(78)
1

三、数组的非纯函数（副作用）操作方法

数组的非函数操作就是会产生副作用而变更原数组的方法，主要是数据操作方法。 首先看Stack栈操作，有推入栈和推出栈两种方法：

> // Stack
> array.push(567)
5
> array
[ 31, 78, 97, 230, 567 ]
> array.pop()
567
> array
[ 31, 78, 97, 230 ]

其次是Queue队操作，排队和出列两种操作方法：

// Queue
// 插入到队列之首
> array.unshift(666)
4
> array
[ 666, 78, 97, 230 ]
// 取出队列首个元素
> array.shift()
666
> array
[ 78, 97, 230 ]

接下来是无处不在的排序方法：

> array.sort((a, b) => a-b)
[ 78, 97, 230 ]
> array.reverse((a, b) => a-b)
[ 230, 97, 78 ]

最后是特殊的splice方法。

将splice单独拿出来是因为其语法比较使人疑惑，其基本语法为：

let arrDeletedItems = arr.splice(start[, deleteCount[, item1[, item2[, ...]]]])

// 首先是插入元素，在指定index的前面插入。
> array.splice(1, 0, 789)
[]
> array
[ 230, 789, 97, 78 ]
> array.splice(2, 0, [4, 5, 6])
> array
[ 230, 789, [ 4, 5, 6 ], 97, 78 ]
// 其次是替换元素
> array.splice(2, 1, [12, 34, 56])
[ [ 4, 5, 6 ] ]
> array
[ 230, 789, [ 12, 34, 56 ], 97, 78 ]

最后提一句，JS的array方法没有直接删除元素的remove, 类似于elisp的

(remove 2 '(1 3 2 4))
;;(1 3 4)

需要拆解为两步才能完成，首先用indexOf找到index，然后再用splice删掉。

> array.indexOf(789)
1
> array.splice(1,1)
[ 789 ]
> array
[ 230, [ 12, 34, 56 ], 97, 78 ]

四、总结

以上为鸿蒙应用开发，从JavaScript入手学习的第一课，从函数式编程的两个维度，是否为纯函数（是否产生副作用）和是否迭代，绘制四象限作归类总结：

最后，一点心愿，写硬核技术文章耗费很多精力，然而流量却远远不及口水文章，作者的坚持需要你的支持和鼓励，有劳费心帮忙点赞转发加关注。

有任何问题，请在评论区留言，将会一一回复。