已发布 / Published 2017-03-07T18:00:29+08:00

千天计划之第980天——rest notes of chapter one

You are totally responsible for yourself.


新读者:可点击阅读此文:

  1. 1000天计划之第零天

  2. 千天计划之第1000天

  3. 千天计划之第999天

  4. ........

  5. 这么多,只看着一个罢:千天计划之第985天——总结



真正的改变源于对自己无能的痛恨!


推荐阅读引我入门的六篇文章:


张砷镓:为什么你应该开始学习编程了?
http://mp.weixin.qq.com/s/jy35Mm8K7FsTxesv9O_Ltg

56 岁的我,是这样战胜自我怀疑学习编程的
http://mp.weixin.qq.com/s/zzoPGDS5eELxEeO_zfG20w


《10大顶级公开课帮你入门前端开发,高中生也能玩转微信小程序》

——FreeGrit潇洒毅行

https://mp.weixin.qq.com/s/0Y65WSrqAiftWav9YiXzGA?scene=25#wechat_redirect



如何入门微信小程序开发,有哪些学习资料?

——FreeGrit 知乎

https://www.zhihu.com/question/50907897/answer/123591539



为何我在学前端网页开发? | 社群招募

——FreeGrit潇洒毅行

http://mp.weixin.qq.com/s?__biz=MzA5NzgxNTk4MA==&mid=2651249861&idx=1&sn=937e871590ca0b4ebe54fb2adf57c2ff&scene=21#wechat_redirect



变革者——献给所有软件开发自学者-作者——麟书

http://www.jianshu.com/p/28f586e72525



其实引我入坑的由无数篇。。。。。




这是下部笔记,上部见此:千天计划之第981天——half notes of chapter one



Chapter 2

Program Structure


http://eloquentjavascript.net/02_program_structure.html



while and do loops



设想一个程序要打印出从0到12的所有数字。


一种写作方法是这样的:

console.log(0);
console.log(2);
console.log(4);
console.log(6);
console.log(8);
console.log(10);
console.log(12);


这样也可以,但违反了编程的本质:减少工作量。如果我们的数字大于1000,那怎么办?很明显,前面的方法就不奏效了,我们需要一种以重复执行某些代码的方式,这种形式的control flow就叫做一个loop,即循环。

looping control flow允许我们返回到之前的某个程序执行点,然后在当前状态下重复执行后面的程序,如果再配合上variables,我们就可以做点有意思的事儿:

var number = 0;
while (number <= 12) {
  console.log(number);
  number = number + 2;
}
// → 0
// → 2
//   … etcetera


以while为关键词开头的语句就是一个循环,loop,下接一个用元括号包裹着的表达式,非常像if语句。循环直到产生为真的value才结束。

在这个循环里,我们既可以打印下来当前已经产生的数字,又可以再加两个变量。无论何时我们需要在loop里面执行多语句代码,只需要把它们包裹在卷括号里面就可以,{},叫做一个block。

nunber验证了variable追踪循环的次数,即循环重复一次,number增加1,然后在重复的每次开始的当儿,它都会与12比较,来决定是否进行下去,任务是否完成。

好,我们现在可以写个小程序了。计算一下2的10次方的结果:我们用到两个变量, 一个来记录我们的每次运算结果,一个来记录我们计算了多少次。这个循环会测试下第二个变量是否达到10,然后同时同步更新两个变量的值。

var result = 1;
var counter = 0;
while (counter < 10) {
  result = result * 2;
  counter = counter + 1;
}
console.log(result);
// → 1024


在这里,counter也可以从1开始算起,然后到小于或等于10结束,但最好从0开始,我们会在第四章详细介绍。


do loop 和while loop相似,不同点在于,do loop 总是至少执行代码一次,然后开始测试是否终止,所以这个表示测试的代码也就出现在loop之后。

do {
  var yourName = prompt("Who are you?");
} while (!yourName);
console.log(yourName);


这个程序会要求你输入名字,然后会一直一直询问,直到得到的不是个无效值。这里面,!会把所有的有效值转换为条件为真,然后循环结束。


indenting code


你可以会注意到一些代码前面的空格,在javascript里,这些不是必须的,实际上,即使每一行代码分成几部分都可以。如果你想,可以把代码只写成一行。我们留出来空格,是为了使代码的格式显露出来,在复杂代码中,尤为可用。


for loops


前面的while语句例子总有许多这样的模式:

首先,counter变量为了记录循环次数
然后,,while循环中测试表达式检验counter是否达到临界点
最后,countet增加计量一次


因为这种模式很普遍,所以javascript等语言提供了一直简单的且可理解性更强的形式,for loop

for (var number = 0; number <= 12; number = number + 2)
  console.log(number);
// → 0
// → 2
//   … etcetera


代码减少了,是因为都把它们放到一个组里面去了。


for后面必须包含括号,其中,第一个是定义变量,第二个是检验循环是否进行的表达式,最后一个是实时更新number的状态。大多数情况下,这种形式都比while简单。


这里用for语句计算2的20次方:

var result = 1;
for (var counter = 0; counter < 10; counter = counter + 1)
  result = result * 2;
console.log(result);
// → 1024


breaking out of a loop


循环出错不是循环终止的唯一方式。

break语句可以立即跳出循环使其终止。


看例子:

for (var current = 20; ; current++) {
  if (current % 7 == 0)
    break;
}
console.log(current);
// → 21


它找到第一个能被七整除的不小于20的数字。
用%可以很容易地测试出一个数能不能被另一个数整除,如果能,则余数为零。

for循环里无检查是否该结束的部分,所以除非break语句执行,否则循环永不终止。


如果你遗漏了break,或者无意间把程序产生的结果都写错成为真,你的程序就会无限循环,这可真糟。
不过若真是这样,页面会过几秒后自动显示,是否终止,要是你点了否,那唯一的人解决办法就只能是关闭整个页面,或者重启浏览器。


continue语句只跳出循环,继续下一个,像是你咬到舌头了,感觉停,然后接着吃饭;而break语句则是像碰着地雷了,完蛋,游戏结束,不再循环。


updating variables succinctly(简洁地)


循环中,需要计数工具,否则谁知道你来来回回算来几次啊,所以有

counter = counter + 1;


javascript有更简单的:

counter += 1;


相似的还有:

 result *= 2 to double result or counter -= 1 to count downward.


这样程序就更简单。

for (var number = 0; number <= 12; number += 2)
  console.log(number);


对于counter += 1 and counter -= 1,
用这个:

counter++ and counter--.



dispatching on a value with switch


代码共同点:

if (variable == "value1") action1();
else if (variable == "value2") action2();
else if (variable == "value3") action3();
else defaultAction();


这叫做,switch语句,用来直接解决dispatch,不过还有另一种:

switch (prompt("What is the weather like?")) {
  case "rainy":
    console.log("Remember to bring an umbrella.");
    break;
  case "sunny":
    console.log("Dress lightly.");
  case "cloudy":
    console.log("Go outside.");
    break;
  default:
    console.log("Unknown weather type!");
    break;
}


你看哪个更好看啊?


警告:break语句不能少,别人就掉小黑屋里了。



capitalization


变量名不包含,空格,但是命名有很多技巧:


fuzzylittleturtle
fuzzy_little_turtle
FuzzyLittleTurtle
fuzzyLittleTurtle


不过建议使用最后一个,可读性强,看着还顺眼,而且很好上手。

comments


这就是用来把艰涩晦深的代码变成人话,而且电脑还不搭理它们。


这多好。


记牢了,写作有两种方式:


第一,先写//,然后写人话


比如,

var accountBalance = calculateBalance(account);
// It's a green hollow where a river sings
accountBalance.adjust();
// Madly catching white tatters in the grass.
var report = new Report();
// Where the sun on the proud mountain rings:
addToReport(accountBalance, report);
// It's a little valley, foaming like light in a glass.


第二,/*和*/之间加人话。


比如,

/*
 I first found this number scrawled on the back of one of
 my notebooks a few years ago. Since then, it has often
 dropped by, showing up in phone numbers and the serial
 numbers of products that I've bought. It obviously likes
 me, so I've decided to keep it.
*/
var myNumber = 11213;


各有各的用处,哪个方便用哪个。

summary


靠,这一章终于快完了,我耗了三天时间看,写。


程序用的是陈述句,然后被if,else,swich的各种情况给打断,然后用循环,while,do,for,loop,让它重复做点事——估计是欺负它傻。不然,人类发明和学习干啥,就是为了省却繁重的枯燥劳动。


变量用英文命名,因为是外国人发明的,要使用,先定义,然后从上到下依次执行。


functions是封装好的代码碎片,但是完整且有用,你可以写functionName(name1,name2)来唤醒。
有点像魔法的样子。



exercise



先告诉你答案在这里:http://eloquentjavascript.net/code/


不过要真想学点什么,建议先做题,再对答案。


请听题,哦, 不,看题


第一题

looping a triangle


注,最简单的不用安装运行环境的,去网页端,那边有代码运行框。


写个代码,输出以下结果:


#
##
###
####
#####
######
#######


提示,找string的长度,可以在其后面写个.length


var abc = "abc";
console.log(abc.length);
// → 3



第二题

fizzbuzz


写个代码,能打印出所有1到100的数,两个条件,能被3整除的,写下fizz;能被5整除的,且不能被3整除,写下buzz。


当程序可以运行时,再调整下,对于3和5都能整除的数字,打出来fizzbuzz,同时3还是fizz,5还是buzz


这个很难,闯关者大部分都已战败,要是你赢了,可以小小傲娇一下下子。


不过我感觉你会动笔么?


第三题
chess board


写个程序,能建了8x8的方格,每个格里要么是空格,要么是#,然后形成一个chess board.


结果要像这样的
 # # # #
# # # #
 # # # #
# # # #
 # # # #
# # # #
 # # # #
# # # #


要是你做好了,然后定义一个size=8,然后可以变为任意数字,然后再输出一个限定高和宽的,你自己看着定吧。

pdf版本:


PDF:http://eloquentjavascript.net/Eloquent_JavaScript.pdf


pdf for phone: http://eloquentjavascript.net/Eloquent_JavaScript_small.pdf


另外如若真的感兴趣,而非看热闹,建议进入原网页阅读原版书籍,因为源代码可在那里执行。


再贴一次:http://eloquentjavascript.net/02_program_structure.html


点击阅读原文可看我在石墨文档编辑的笔记,阅读体验比较好