第二章作业

第一题乘法口诀表代码：

.wxml文件代码

<!--9*9乘法表实现-->
<view class='a' wx:for="{{[9,8,7,6,5,4,3,2,1]}}" wx:for-item="a">
  <view class='b' wx:for="{{[9,8,7,6,5,4,3,2,1]}}" wx:for-item="b" wx:if="{{b <= a}}">
    {{b}}*{{a}} = {{b*a}}
  </view>
</view>

.wxss文件代码

.a{
    display: flex;
    justify-content: flex-start; /* 线性布局 */
    font-size: 8px;
  }
   
  .a .b{
    width:45px;
  }

运行结果：

第二题在Console控制台输出水仙花数

.js文件代码：

Page({
    onLoad: function () {
      // 遍历3位数的所有数字
      for (let i = 100; i < 1000; i++) {
        // 计算各位上的数字的3次幂之和
        let sum = Math.pow(Math.floor(i / 100), 3) + Math.pow(Math.floor(i / 10) % 10, 3) + Math.pow(i % 10, 3);
        // 判断是否为水仙花数
        if (sum === i) {
          console.log(i); // 输出水仙花数到控制台
        }
      }
    }
  })

Console控制台输出结果：

第三题在页面中输出水仙花数

.js文件代码：

Page({
    data: {
      narcissisticNumbers: [] // 用于存储水仙花数的数组
    },
  
    onLoad: function () {
      // 计算水仙花数
      for (let i = 100; i < 1000; i++) {
        let num = i.toString();
        let sum = Math.pow(parseInt(num[0]), 3) + Math.pow(parseInt(num[1]), 3) + Math.pow(parseInt(num[2]), 3);
        if (sum === i) {
          this.data.narcissisticNumbers.push(i);
        }
      }
  
      // 更新数据，将水仙花数渲染到页面上
      this.setData({
        narcissisticNumbers: this.data.narcissisticNumbers
      });
    }
  });

.wxml文件代码：

<view>
  <text>水仙花数：</text>
  <view wx:for="{{narcissisticNumbers}}">
    <text>{{item}}</text>
  </view>
</view>

代码运行结果：

第四题在页面中输出菱形图案

.wxml文件代码：

<view class="a">
  <view>*</view>
  <view>***</view>
  <view>*****</view>
  <view>*******</view>
  <view>*********</view>
  <view>*******</view>
  <view>*****</view>
  <view>***</view>
  <view> *</view>
</view>

.wxss文件代码：

.a {
    margin-top: 15px;
    font-size: 15px;
    text-align: center;
  }

代码运行结果：