操作题
1.利用wx:if及wx:for数据绑定来实现输出乘法表口诀表的编程。
// index.js
Page({
data: {
multiTable: []
},
onLoad: function () {
// 生成乘法口诀表
let multiTable = [];
for (let i = 1; i <= 9; i++) {
let row = [];
for (let j = 1; j <= i; j++) {
row.push(`${j}x${i}=${i * j}`);
}
multiTable.push(row);
}
this.setData({
multiTable: multiTable
});
}
});
{
"navigationBarTitleText": "乘法口诀表"
}
<!--index.wxml-->
<view class="container">
<view style='font-size:8px' wx:for="{{multiTable}}" wx:key="{{index}}">
<view style='display:inline-block;width:35px;font-size:8px' wx:for="{{item}}" wx:key="{{index}}">
<text>{{item}} </text>
</view>
<text wx:if="{{index != 8}}"> | </text>
</view>
</view>
/**index.wxss**/
.container {
display: flex;
flex-direction: column;
align-items: center;
}
.container text {
margin: 5px;
}
2.编写程序,在Console控制台 输出水仙花数(水仙花是指拥有一个3位数的各位上的数字的3次幂之和等于它本身。例如,1的3次幂+5的3次幂+3的3次幂=153)
Page({
data: {
narcissisticNumbers: []
},
onLoad: function () {
const narcissisticNumbers = this.findNarcissisticNumbers();
this.setData({
narcissisticNumbers: narcissisticNumbers
});
},
isNarcissisticNumber: function (num) {
const strNum = num.toString();
const digits = strNum.length;
let sum = 0;
for (let i = 0; i < digits; i++) {
sum += Math.pow(parseInt(strNum[i]), digits);
}
return sum === num;
},
findNarcissisticNumbers: function () {
const narcissisticNumbers = [];
for (let i = 100; i < 1000; i++) {
if (this.isNarcissisticNumber(i)) {
narcissisticNumbers.push(i);
}
}
return narcissisticNumbers;
}
});
{
"navigationBarTitleText": "水仙花 n"
}
<view class="container">
<view wx:for="{{narcissisticNumbers}}" wx:key="{{index}}">
<text>{{item}} </text>
</view>
</view>
.container {
display: flex;
flex-direction: column;
align-items: center;
}
.container text {
margin: 5px;
}
3.编写程序,在页面中输出水仙花数。
代码:
Page({
data: {
narcissisticNumbers: []
},
onLoad: function () {
const narcissisticNumbers = this.findNarcissisticNumbers();
this.setData({
narcissisticNumbers: narcissisticNumbers
});
},
isNarcissisticNumber: function (num) {
const strNum = num.toString();
const digits = strNum.length;
let sum = 0;
for (let i = 0; i < digits; i++) {
sum += Math.pow(parseInt(strNum[i]), digits);
}
return sum === num;
},
findNarcissisticNumbers: function () {
const narcissisticNumbers = [];
for (let i = 100; i < 1000; i++) {
if (this.isNarcissisticNumber(i)) {
narcissisticNumbers.push(i);
}
}
return narcissisticNumbers;
}
});
{
"navigationBarTitleText": "水仙花数"
}
<view class="container">
<view class="row">水仙花数共有:
<view wx:for="{{narcissisticNumbers}}" wx:key="{{index}}">
<text>{{item}} </text>
</view>
</view>
</view>
.container {
display: flex;
flex-direction: column;
align-items: center;
}
.row {
display: flex;
flex-direction: row;
}
.container text {
margin: 5px;
}
3.编写程序,在页面中输出菱形图案。
Page({
data: {
diamondLines: []
},
onLoad: function () {
const diamondLines = this.generateDiamond(5); // 菱形的高度为5行,可根据需要修改
this.setData({
diamondLines: diamondLines
});
},
generateDiamond: function (height) {
const lines = [];
for (let i = 1; i <= height; i++) {
let line = '';
for (let j = 1; j <= height - i; j++) {
line += ' '; // 填充空格
}
for (let k = 1; k <= 2 * i - 1; k++) {
line += '*'; // 绘制菱形
}
lines.push(line);
}
for (let i = height - 1; i >= 1; i--) {
let line = '';
for (let j = 1; j <= height - i; j++) {
line += ' '; // 填充空格
}
for (let k = 1; k <= 2 * i - 1; k++) {
line += '*'; // 绘制菱形
}
lines.push(line);
}
return lines;
}
});
{
"navigationBarTitleText": "菱形"
}
<view class="container">
<view class="diamond">
<view wx:for="{{diamondLines}}" wx:key="{{index}}">
<text>{{item}} </text>
</view>
</view>
</view>
.container {
display: flex;
vertical-align: middle;
text-align: center;
}
.diamond {
margin-top: 100px; /* 调整菱形位置 */
}
.container text {
margin: 5px;
}