javaScript打印等腰三角形,全网最详解(费曼学习法)

至于是不是全网最详细,不敢说。但是很详细。立志于打造8岁小孩都能听懂的等腰三角形。

首先你需要具备以下知识,for循环,基础运算(加减乘除),javaScript的基础.,年龄大于等于8岁。

 

请耐心看完。中途若不适请耐心看

 

1.首先树立一个正确结果的目标。这里给大家手绘了一个结果。等腰三角形

 

javaScript打印等腰三角形,全网最详解(费曼学习法)_第1张图片

2.分析发现,这东西有3行,第一个行有2个空格,1个点    第二个行有1个空格,3个点   第三行有0个空格 5个点

 

javaScript打印等腰三角形,全网最详解(费曼学习法)_第2张图片

3.那对于一行来说,不就是先打印空格,在打印点嘛

每一行内的程序
document.write(空格)
document.write(点)

怎么打印2个或者多个点,那不就是循环嘛。空格也是循环嘛,当然也是啦。

那我们先从空格开始打印,

4.空格分析

通过肉眼观察发现,空格出现的次数为

第一次 2个空格

第二次 1个空格

第三次 0个空格

每一次换行,总共三行。写法是什么呢?

第一个肯定是个大循环3次,打印3行

javaScript打印等腰三角形,全网最详解(费曼学习法)_第3张图片

第二个是每个大循环里 打印空格

(1).    j<=3是打印3次,那我改成2是不是打印2次

javaScript打印等腰三角形,全网最详解(费曼学习法)_第4张图片

(2).  改成2次后,每行是不是打印了2个,但我们想要的是第一次打印2个,第二次打印1个,想了一秒钟

2-1=1

2-2=0

2-3=-1

(3).这样不就行了吗,但是却是1 0 -1,很显然,我们不能改成2,要改成3.才可以,于是我们把j<=2改成了j<=3

javaScript打印等腰三角形,全网最详解(费曼学习法)_第5张图片

(4).因为3刚好符合下面条件

3-1=2

3-2=1

3-3=0

(5).3我们确定了,那么被减数怎么确定。

javaScript打印等腰三角形,全网最详解(费曼学习法)_第6张图片

我们是几行?

3行对吧。那大循环的i是怎么变化的?

1 ,2 ,3是不是刚好符合

那么把 被减数改成i 不就完成了嘛

javaScript打印等腰三角形,全网最详解(费曼学习法)_第7张图片

(6).我们打印

javaScript打印等腰三角形,全网最详解(费曼学习法)_第8张图片

结果,完成

javaScript打印等腰三角形,全网最详解(费曼学习法)_第9张图片

小总结:注意这2个保持一直,多大的等腰三角形的空格都没有问题,当然也包括等腰梯形等。

javaScript打印等腰三角形,全网最详解(费曼学习法)_第10张图片

 

5.空格没问题了,接下来就是点

javaScript打印等腰三角形,全网最详解(费曼学习法)_第11张图片

 

(1).通过肉眼观察,第一次 每一行有1个点,第二次 每一行有3个点 ,第三次 每一行有5个点。

1 3 5 是什么?噢,好像咱们学的那个奇数啊

那奇数怎么用函数表示  ,花了10秒 想了下

2x-1

 

(2).那是不是适用呢,4行,5行的等腰三角形呢?

4行的 点 有多少

1 3 5 7

5行的有多少

1 3 5 7 9

2x-1完全适用

 

(3).2x-1

第一次为1个点.那么x为1

第二次为3个点,那么x为2

第三次为5个点,那么x为3

x为1 ,2 ,3,好熟悉,像大循环中的谁

大循环中的i

 

(4). 代码

javaScript打印等腰三角形,全网最详解(费曼学习法)_第12张图片

空格是 

结果

javaScript打印等腰三角形,全网最详解(费曼学习法)_第13张图片

nbsp占1个字节.但是一个字符串占2个字节

所以我们写2个nbsp就可以对齐

 

(5).最后总结果




    
    
    Document
    
    


    

javaScript打印等腰三角形,全网最详解(费曼学习法)_第14张图片

 

 

 

你可能感兴趣的:(前端,javascript)