XDL_NO.2 指令式编程

指令式编程

培养指令式编程思维

复习上一节课的内容
  1. Markdown是一种轻量级的「标记语言」,使用它来书写文档、代码规范,只要专心码字就行,排版什么的它都帮你轻松搞定!好比,使用Markdown,项目经理再也不用担心我的文档了!
  2. 全栈工程师的概念,服务器、运行环境、数据库、前端、后端、APP(这里我们注重的是Hybrid App) 直到上线,全部由一个人搞定!很牛叉吧,我会成为这样的人才的!不要羡慕哥,努力、坚持的人总能吃到西瓜的!
  3. 编程语言的发展历史,各种语言的优势和劣势,编程语言发展趋势只会越来越简单,方便人的操作,节省人力、脑力,让机器去操作运行,喂,机器,快死去干活,你懂的!
  4. 编程语言执行的两种方式:指令式编程、函数式编程;指令式编程,按照机器的运行规则来执行;函数式编程,就是让电脑像人脑一样的运行;你觉得那种好?这还要问,当然是两种一起来,机器必须服务我的指令(不然像机器反主怎么办,对吧!),但是在我让它做某项事物的时候,我抛概念,机器你来执行,好比:我要赚一百万,机器你来完成如何给我赚一百万,我只要结果,过程你来!嘿嘿!
进入今天的内容
  1. 明确目标:培养人像电脑一样思考!要玩转它,首先你要懂它!
  2. 全栈开发中,Js的比重很大,适用于很多一面。
  3. 指令式编程,通过js来阐述它。

指令式编程

阐述之前,先扩展两条Node命令

  • node -v 查看当前Node版本
  • node 进入交互模式
指令式编程最基本的指令
顺序结构语句
顺序结构

像 2+3、2*3、3-1,这种形式的都是计算机指令,<b>计算机指令不等于cpu指令</b>
而 a=3,a +=1、a *=1、a++,这带有变量的指令,变量存储在内存中
执行流程是从上而下的顺序结构!


分支结构语句
if( true ) {

}else{

}

给予简单的判断,进入不同的结构

循环结构语句
  (初期循环结构应该是 goto 这种形式)
    a++;
    a:
    if( a > 10)  goto a;
    //当a>10条件满足时,进入无限循环,想要跳出循环,两种方法:
    // 1. 从满足条件开始起一直到不满足
    // 2.
    a:
    if( a > 50 ) goto b;
    goto a;
    b:

懒猿不想写这么繁琐的,所以因然而生,while 语句

var i = 100;       
while(i<100 ){
     i++;
}
//条件不满足,跳出循环结构
var flag = true;
while(flag){
    break;//满足条件的我就这么任性就是想这里跳出
}

懒猿还想再懒点,所以 for 又出现

       for(var i=0;i<100;i++){
                
       }
       //剖析
       var i = 0;
       for(;i<100;){//中间的是条件
             i++;
       }

指令式编程的最基本的指令就这三种了,执行流程也要遵循:

  1. 从上而下
  2. 根据条件
  3. 最后一个就是 在函数里
函数 执行流程
  var a=0;
  function f( ) {
     console.log(a); 
  }
  f();
  //当函数依次执行到  f() 函数时(存储到了内存但并不执行),没有被调用,不执行函数体,所以来到下面 函数 f() 被调用,返回到 函数执行函数体。 
 var a=0;
  function f( ) {
     console.log(a); 
     return 0;
  }
  var s = f();  
  // 函数体内有返回值,就会把返回值返回到调用处。也就是说 s等于0;

最基本的指令式编程的执行流程如上所述这样了,那下面,就从计算机最基础的指令开始,来强化理解计算机指令式编程,不断加强!


以打印图形来开始

打印图形

这样的重复劳动造轮子的工作还是让给机器吧!
打印图形

那想打印个矩形,怎么办呢?



还是同样的重复劳动,那我们是不是可以按照重复劳动的规律,写个简洁的.


打印矩形

那根据上述的循环,我是不是可以对他进行封装,来控制矩形的长宽,想要什么样的打印什么样的。提取事物共同的特性,用一个抽象的概念来涵盖!


打印矩形

抽象化后,封装的函数达到了初期我想要的目标,那我是不是还可以对它进行抽象,毕竟我今天想用星,那我后天想用别的符号呢!所以继续...


打印矩形

懒猿认为,好像并不是更方便了,反而有点复杂了!


打印矩形

这样看是不是 舒服多了,也方便多了,也更容易读懂了!那下面懒猿又要开始思考了,正方形也是矩形,对吧!只是长宽都一样,那同理我的正方形是不是也可以打印出来了!


正方形

那通过上面这几个实例,是不是更加对指令式编程又有新的了解了,好了,通过上边几个方法,我们是不是可以打印出我们想要的任何图形,请看:
空心矩形

三角形

梯形

根据这些规律,我们是不是可以进行封装,成为一个像上面输出矩形函数一样,等待更新!

打印空心矩形函数

规律:除了特殊的两行,第一行和最后一行全星,中间的都是第一列和最后一列是星,中间是空格,这个规律知道了,我们是不是只要给个判断,就会得到我们想要的,既然思路来了,就动手试验试验吧!


空心矩形
打印等边三角形函数

规律: 看下图我们来找找规律!


等边三角形

那看到这,是不是有点明白了,每行输出的星的个数和空格的个数都跟输出的行数有关,根据下图是不是明白输出的原理了!从中我们也推算出每行星的输出个数的方程式了:2n-1(n代表行)

第几行 空格数 星个数 规律
1 9 1 1x2-1=1
2 8 3 2x2-1=3
3 7 5 3x2-1=5
4 6 7 4x2-1=7
5 5 9 5x2-1=9
6 4 11 6x2-1=11
7 3 13 7x2-1=13

当你不明白一个事物的时候,别急,怎么先找一个客观存在的事物,找出他的共性,然后抽象它!
代码:


三角形
打印梯形

规律: 三角形砍了头,是不是就一个梯形了!那好根据这个我们用示例图更直观的看下:


梯形

那我一个上边是5颗星,下边是19颗星的 梯形;更据三角形规律方程式2n-1;我们是不是知道要输出一个几行的三角形,然后从第几行砍掉头!活生生的梯形不就展现在我们面前了!
代码


梯形

输出梯形
打印梯形

还是一样,先找出规律:

空心三角形

这个实例图看到时,是不是瞬间就得出,

  1. 第一个星和最后一个星打出,中间空格;也就最外边打印
  2. 然后加上一个特殊行,最后一行全星就组成了一个空心三角!

那我们是不是可以更据这个两个判断,再加上输出上述等别三角形的例子,是不是就可以打印出空心三角形了!

代码


空心三角形

Javascript 的两个不同的工作环境下的工作状态

客服端

Javascript 中变量作用域的问题

  • 多人团队项目开发中,存在最多的问题,命名空间污染问题,java当中有引入包名称来解决,js当中可没有引入类似包、命名空间这些,所以怎么解决呢!
熟悉js作用域
  <!DOCTYPE html>
  <html>
     <head>
         <meta charset="utf-8">
         <title>JS 中的作用域</title>
   </head>
    <script type="text/javascript">
      var = a; //这么低级的错误肯定不会犯的
      //var = a;
    </script>
     // 这是一个外部引入 js文件
    <script type="text/javascript">
      var = a; //这个文件也声明了一个这样的变量,那是不是就冲突了
    </script>
  <body>

  </body>
</html>

分析作用域

  <!DOCTYPE html>
  <html>
     <head>
         <meta charset="utf-8">
         <title>JS 中的作用域</title>
   </head>
    <script type="text/javascript">
           var a  = 5;//全局变量
           function f() {
              var a = 3;//这样就不冲突了,这里的a 是局部变量
              alert(a);    //这里输出的是函数内的a     
          }
          alert(a);//5
          f();// 3           
    ——————————————————————————————
           //var a  = 5;//全局变量 相当于 window.a (最顶层的a)=5;
           window.a = 5;
           function f() {
               var a = 3;
              // a = 3;//这样 a ,在函数调用后,也是全局变量,根据js的特性,闭包函数,a 会一直往外(函数外)寻找!直到找到最顶层!
              alert(a);    //这里输出的是函数内的a  
              window.a = 6;   
          }
          alert(a);//5
          f();// 3  
          alert(a);//6
    </script>
  <body>

  </body>
</html>       

网页中的 js 全局变量是 window.a ,在node 环境下 是: global a ;这样你对js中的作用域更深入的了解了吧!
参考文档

我叫了,你不能叫!你叫了,我不能叫!

为了解决这个问题,经常用到这个方法!

  (function (){//匿名函数
       var  user;
       alert("a ");//会立即执行
  }) () ;

function f() {
  var a = function(){

   };
}

 function f() {
    return function () {//返回一个函数
            
     }
 }
 var x = f();//调用函数f(),返回一个函数,给了x;
 x();  //这样 x() 可以调用函数了!

总结

  1. 了解最基本指令式编程里的最基本的指令,体会机器执行程序的流程,是自己更明白电脑执行流程!
  2. 了解js 在不同环境下的工作状态,js的变量作用域问题,和一些解决办法!
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,456评论 5 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,370评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,337评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,583评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,596评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,572评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,936评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,595评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,850评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,601评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,685评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,371评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,951评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,934评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,167评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 43,636评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,411评论 2 342

推荐阅读更多精彩内容