表达式 (14分钟)

在这节课，我们要将表达式加到我们学过的代码里

这是我们开始要写的

最后一段有关现实的图像操作

这节课结束前，我们将会试试基于图像的拼图，会很有意思

我们已经写过这样的代码很多次了，这里是 print(42)

数字可以是40、400或250，代码里写什么数字都可以

你也可以以这种方式写代码，这里是 print(11+31)

11+31 是表达式

这不是我们之前讲过的固定值，我们可以用一个小小的算术表达式

11+31 是一个小问题

原理是当计算机运行时，读取这一行

计算机首先要做的是求表达式值

我要求这个值

这里计算机做的是加法11+31是42

求表达式得到42后，代码可以继续，就使用这个值

这里只是打印42

我们不在代码里写0、255、100或其他数值

我们可以填一个小算术表达式

利用运算来计算要在代码里使用的数值

这可以帮助我们更好地解决问题

尽管还没讲到，像素有三个额外的功能

pixel.getRed()，getRed 与 setRed 相反，是取像素的值

这是某个红色值，0、100或其他

这个代码是取红色值，这里是 getGreen 和 getBlue

用表达式去取像素的 RGB 值是很普遍的

设想我要将像素的红色值翻倍，红色值是50的话，要改成100

值是100的话，改成200，等等

这是要用到的代码，我来解释一下

改变像素的值，将其变成三倍等等

是处理像素的 RGB 值一个比较现实的作法

看看这行代码的作用

这是正确的，它将像素的红色值翻倍，第一行是 pixel.getRed()

它要取值，红色值是50

pixel.getRed() 是要取值50

我们使用的是等号，和以前一样，等号是将值存储在变量里

我将旧值称作 old

这里就是将50存储在 old 里

下一行是 pixel.setRed(old "times"2)。我在这里用表达式

这里的方式是到这行时，代码首先要求表达式

计算机会先读 old * 2

记得存储的是50，所以这里说50乘2

求值得100

求得值后，就可以继续运行代码，这是 pixel.setRed，就是100

整个过程就是取50，乘以2得100

然后将100放回去，就是值乘以2

实际上我们是这样写代码的

全部内容都可以缩成一行

因为 old 这个变量没有添加太多内容

它只是一个暂时的存储点

设想像素的红色值是50，我要运行一下。我将这缩成一行

设想一下运行代码

这有个像素，红色值是50的像素，我要运行这行代码

计算机首先会注意到这有个表达式， pixel.getRed()*2

将要求表达式，因此 pixel.getRed()要取红色值

譬如说50

跟50乘以2的数学是一样的，得到100

这里调用 pixel.setRed(100)，然后放回去

这里的原理和我们刚才讲的一样

先取值，乘以2，再放回去

用英语讲，就是将红色值翻倍。我要做一些遵循这个模式的例子

我们要看到的是，我开始在循环里使用之前的

0或250，我们有一些固定值

不过现在，我们要写代码，这是我刚做的实例

我们要根据原来的红色值来改变红色值

原理是，我们常说 pixel.setRed

在括号里，我们将调用 pixel.getRed()，然后有一些算式

这个例子里，这行将红色值翻倍

或调用 pixel.setRed (pixel.getRed()*0.5)

取旧值，并乘以0.5，或者是除以2

将值变小，然后放回去

我们会遵循这个模式很多次。我们来做一个真正的实例

我要取这朵花的值，我要将其变橙色

我的策略是改变绿色值

我们将绿色值调低

从数学上，将绿色值改为其原有值的75%

这页里没有代码，我要键入代码

我要将绿色值改成原来的75%

这是我刚才演示过的实例

这里写 pixel.setGreen，你也可以从外到内

我要调用 setGreen，这里要写一些表达式

我要用表达式来计算一个作为绿色值的数值

这里用 pixel.getGreen()，我要取旧值

将其乘以任何数。在这里，乘以0.75

我要将数值变成原来的四分之三

试试看，是可以的，或许你叫这种颜色为黄色

如果填1.0，可以是没有任何改变

很好看的黄色。这是0.75

这是橙色，应该说，在这些实例里

我刚才花了点时间键入代码

如果你要自己试试也可以，这里有一个显示答案的小按钮

你可以稍后再复习，可以看到这段答案代码

用作练习的目的的话，最好用空白屏幕开始

真正经历输入代码的过程

所有这些实例都遵循这个模式，我们来试试难一点的内容

这里将红色值、绿色值和蓝色值设成原来的0.75倍

我们试试0.5倍和0.25倍，计算机科学的一个伟大传统是

不从头开始输入代码，而是复制代码

这是我原来写的代码，我来复制一下，我要复制三次

我们来修改一下，达到我们要的效果，顺序是红、绿、蓝

这里写 setRed，getRed()，填0.75

这个好了。然后是 setGreen(getGreen()*0.75)

最后是蓝色，setBlue(pixel.getBlue())

你可以看到这里将 set 和 get 组合起来，这是个十分可行的模式

我按这种方式运行一下。变化不是太明显

但这里是将原图变暗

你想一下，就知道将原值乘以0.75，就是将值移近0

很明显，0、0、0是纯黑，所以我们是将数值压缩

我们来试一些更极端的实例。将原值乘以0.5

运行一下，变暗了一些。乘以0.25的话

是原值的四分之一，变得很暗

这里的用法是将 setRed 和 getRed() 结合

乘以倍数，改变数值

将原数值增大或缩小

我要跳过第三个问题

这只是额外的练习，如果你要试试看的话，这有解答代码

我要做的是研究这些5、10 和20问题

5、10和20问题的概念是这里有一些花朵图像或水果图像

这些图像经过更改

更改的方式是将红、绿和蓝的值除以5、10或20

这些值非常小，图像可能会非常暗

困难的是要将红、绿和蓝的值乘以5、10或20

撤消变暗的作法是将图像变亮

我们来做一些试验，多做尝试

看如何将图像变亮

那么用数值5一次，用10一次，用20一次

你要看看哪种颜色使用哪个数值

应该说，你知道使用5、10和20有六种方法

所以不需花太多力气

你可以想象首先在红色值用5

首先是5，然后是5、10、20

如果先用5，那么只剩下两个可能

如果先用10，只剩下两个可能

如果先用20，只剩下两个可能，这样你就可以整理出来

我们回到这里

复制一段代码，就不用从头写起

我们这里有一根香蕉，我先将这几行设为说明

我们看到图像里什么都没有

所以这是个疑问图片，我告诉你

这里有根黄香蕉，背景是暗红砖

在红砖之间，有一些绿色苔藓

如果你修改图像的话，就可以看到这些东西

我要用乘法，先用5、10、20

譬如，红色值乘5,

绿色值乘10、蓝色值成20

只是猜一下，来试试看

显然是不对的，是吧？香蕉看起来不对劲

砖头有点蓝色，不好看

我仍然使用先用5这个假设，再试其他变化

譬如5、20、10，我们来试试看，更糟糕

好吧，我不首先用5了，已经试过先用5两次了

试试用10、5、20

我将这些值增大，快弄好了

香蕉看起来挺不错的，但是砖块很明显不是紫色的

它们应该是红色

我试着在中间用5，然后先填20

试试20、5、10

你可以看到砖头是暗红色

这还有些绿色苔藓，令人放心了，我要放大

给你看看一些细节

这是砖块，苔藓和香蕉都不错

但这里有点小东西，香蕉这里有些横线

这是可以的，只是快速查看图像时像素的显示方式而已

之所以这样，是因为当红、绿、蓝

除以诸如10或20的数值时

这些通常从0到255的数值

被缩成从0到12或从0到24的数值

被压成这个范围的数值时，只有一部分的黄色可选

尽管我们将数值增大后

仍只有这些颜色可选

所以我们看到这些平行线，它们只是深浅不同的黄色

所以是无法捕捉的，我来放大看看

是无法捕捉的，这是你想要的实际渐变色

这个练习就是这个原理

本节课的练习有更多的5、10、20难题

你应该认真学学