1、案例分析

案例描述.jpg

2、制作流程：

2.1、代码实现：

wxml：

<view class="box">
    <view class="title">随机数求和</view>
    <view>产生的随机数为：</view>
    <view wx:for="{{rand}}" wx:key="*this">{{item}}</view>
    <view>随机数列的和：{{sum}}</view>
    <button bindtap="produce" type="primary">产生随机数且求和</button>
</view>

js：

var sum = 0;
var rand = [];
function makeRandom(){
    for(var i = 0;i < 3;i++){
        rand[i] = (Math.random() * 100).toFixed(2)*1;
        sum += rand[i];
        console.log(rand[i])
    }
    console.log(sum)
}
Page({
    data:{

    },
    produce:function(){
        sum = 0;
        makeRandom();
        this.setData({
            rand : rand,
            sum : sum
        })
    }
})

2.2、结果展示：

结果展示.jpg

3、知识总结：

知识点概述.jpg js中对象的概念.jpg array对象属性或方法.jpg array对象属性或方法.jpg number对象属性或方法.jpg
number对象属性或方法.jpg

4、踩坑说明：

• 写在Page（）中的叫做事件，写在Page（）外的叫做函数，且书写格式不一样。
• 代码纠错

//错误代码：导致列表为空，错误原因Math.random后没加()
var sum = 0;
var rand = [];
function makeRandom(){
    for(var i = 0;i < 6;i++){
        rand[i] = parseFloat((Math.random * 100).toFixed(2));
        sum += rand[i];
        console.log(sum)
    }
}
//第一次修正后的代码：会导致打印出的sum小数点位数过多。未知原因，偶尔发生。
var sum = 0;
var rand = [];
function makeRandom(){
    for(var i = 0;i < 6;i++){
        rand[i] = parseFloat((Math.random() * 100).toFixed(2));
        sum += rand[i];
        console.log(sum)
    }
}
//第二次修正后的代码：会导致打印出的sum小数点位数过多。未知原因，偶尔发生。
var sum = 0;
var rand = [];
function makeRandom(){
    for(var i = 0;i < 6;i++){
        rand[i] = (Math.random() * 100).toFixed(2)*1;
        sum += rand[i];
        console.log(rand[i])
    }
    console.log(sum)
}

• 注意Math.random()产生的是一个0~1开区间之间的数字。