手段之编程语言（下）

二、脚本语言：JavaScript || CoffeeScript

既然HTML和CSS作为标记语言只是文档，不能执行命令，那网页上那些点击、输入、跳转和各种转场动画是怎么来的？这时候就需要用到编程语言了，但是C、C++和Java又太复杂，主要是还需要后台编译生成EXE文件才能执行，有没有可以用浏览器直接执行的语言？于是脚本语言（Script Language）登场了，它具有简单、易学、易用的特点，只在需要的时候被浏览器调用和运行，其中最著名的就是JavaScript了。现在所有网页上的交互动作和动画，包括弹窗、H5上的整屏动画以及输入框提示等等，都是通过JavaScript（简称JS）来实现的。所以如果你要做一个网站，HTML+CSS+JS才是一个完整的网页前端解决方案。但是JavaScript顾名思义，还是基于Java语言简化过来的东西，Java是一个历史比较久的编程语言了，本身的学习成本就很高，就算再简化也好不到哪里去。于是后来又出现了一个基于JS的的简化语言——CoffeeScript，它的语法吸收了很多现代编程语言如Python和Ruby的精髓，非常简洁易懂，而且还可以通过后台转译成JS，和JS的环境无缝连接。下面是两种语言的对比：

(引用自CoffeeScript中文网)看到CoffeeScript这个名字，你是不是觉得有点眼熟？没错，我最喜欢的高保真原型工具——Framer，它的代码部分就是基于CoffeeScript的。它的语法有多简单呢？举个例子：

你想让上面那个界面中的“Get Started”按钮点击后跳转到下一个界面，那就这么写：

GetStarted.onClick->

flow.showNext(OnboardingConnect)GetStarted是按钮的名字，Onclick代表鼠标点击动作，->代表触发一个程序行为，这个行为就是让页面流程Flow切换到下一个界面（showNext），界面名称是OnboardingConnect。这些按钮和界面都是我们在Framer的Desgin Mode下设计并命名的。是不是够简单？一个完整的编程语言，还有很多内容需要你知道：

变量（字符串、布尔值、数组等）

函数

基本的运算

if…else条件判断

for…in循环、while循环

这些内容是每一门编程语言的共通特性，都可以在JavaScript和CoffeeScript中学到，还可以很快地运用到网页设计中去，基于实例的学习才是最快、最有效的。所以我推荐想学一点编程知识的同学，可以从网页设计和开发学起，这样双管齐下，以后至少还能给自己做一个作品集网站吧。推荐书籍虽然CoffeeScript很简单，但是市面上也没啥靠谱的教程书，还是JS的学习体系比较成熟，所以要学的话还是先从JS学起吧，等到学会了基本知识再去了解CoffeeScript，就可以很快上手了。还是推荐同一个作者达科特（Duckett J）写的《Web设计与前端开发秘籍：JavaScript & jQuery 交互式Web前端开发》，推荐理由同上文，我自己也在看这本。

三、高级语言：Swift (Xcode)

如果前面两种都还不能满足你，一定非要亲手做个可以在手机或者电脑上运行的软件的话，那苹果官方推出的Swfit语言和Xcode编辑器无疑是你的最好选择。Swfit和C、C++、Java、Kotlin、Python这些一样，同属于高级编程语言，是可以真正写出电脑上、手机上可执行程序的万能语言，所有的iOS和Mac平台上的App、游戏等都是用它写的。这门语言的最早的形态是由乔布斯领导的NeXT计算机公司发明的Objective C（C语言的高级分支），苹果收购NeXT后，它就成为了iOS和Mac系统的底层语言。但是每一门语言使用久了之后都会逐渐暴露出一些之前设计上的缺陷，同时还有各种效率更高、更简化的新语言在诞生，于是苹果公司就在2014年推出了改进版的、开源的新型编程语言——Swift。相比它的前辈Objective C和C、C++，甚至是安卓以前的官方语言Java，Swift都具有很多独特的优点：它既满足了高级语言的工业化标准，又具有脚本语言简单易学而且有趣的特点；它既可以用来编写像Hello World一样的简单程序，也可以用来编写操作系统的底层代码；它还可以不用生成可执行文件直接在窗口中预览界面效果和代码运行结果。再加上和自家推出的Xcode开发环境，配合起来简直天衣无缝。

上面这就是Xcode的主界面，你可以在这里直接拖动添加各种控件到左边画面中，然后在右边调整各种属性和参数，是不是和Sketch有点像？

配置好控件后，依然可以用拖动的方式将控件添加到代码中，然后为它们添加相应的交互响应事件和运行逻辑。下面这个是我之前做的一个练习，App可以自动生成一个1~100以内的随机数，然后让你来猜，程序会告诉你输入的数字是小了还是大了，就像以前幸运52猜价格一样，直到猜中为止。

这样一个简单的程序，用Swift和Xcode来按照教程学习，就算是新手也只需要一天的时间就能做出来。因为这个是货真价实的软件开发，比较高阶，我就不推荐书了，感兴趣的同学可以去udemy.com这个网站去搜索Swift视频教程，一位叫做Wei Wei的中国台湾开发者讲的非常好。为什么我只推荐苹果系的Swift，而不是安卓系的Kotlin和Java呢？因为相比苹果这种闭环的生态链来说，安卓的开发环境和语言的学习曲线实在太不友好了，对于新手来说简直是信心和乐趣的大杀器，再加上千变万化的屏幕分辨率和无数的机型，还是饶了我吧。系列文章题图的图片授权基于：CC0协议【书斋小笺】今天算是挣扎着早起了，写到一半又去处理家里的事情，吃完午饭后继续写到现在才写完。这个专题由于是选修，还是设计师最苦手和不感兴趣的开发类知识，所以愿意坚持看完的同学应该很少吧。能看完（并点赞）的同学真的是好样的，这份好学精神一定会让你们比别人走得更远的。这篇文章编号229，首发于2018年6月17日。