Function requirements: given the amount and number of red packets, fair and random allocation of red packets amount

# 1: Cut the watermelon

html

<h2> <div id="setting"> <div><label> <input ID ="amount" value=100.00></input></label></div> <div><label> < input id = "count" value = "10" > < / input > < / label > < / div > < div > < button id = "generateBtn" > randomly generated < / button > < / div > < / div > < ul id="result"> </ul>Copy the code

css

#setting button {
  margin-top: 10px;
}

#result {
  padding: 0;
}

#result li {
  list-style: none;
}
Copy the code

js

function generate(amount, count){ let ret = [amount]; While (count > 1){let cake = math.max (... ret), idx = ret.indexOf(cake), part = 1 + Math.floor((cake / 2) * Math.random()), rest = cake - part; ret.splice(idx, 1, part, rest); count--; } return ret; } const amountEl = document.getElementById('amount'); const countEl = document.getElementById('count'); const generateBtn = document.getElementById('generateBtn'); const resultEl = document.getElementById('result'); generateBtn.onclick = function(){ let amount = Math.round(parseFloat(amountEl.value) * 100); let count = parseInt(countEl.value); let output = []; If (isNaN (amount) | | isNaN (count) | | amount < = 0 | | count < = 0) {output. Push (' input format is not correct! '); }else if(amount < count){output.push(' output.push ')}else{output.push(... generate(amount, count)); output = output.map(m => (m / 100).toFixed(2)); } resultEl.innerHTML = '<li>' + output.join('</li><li>') + '</li>'; }Copy the code

Divide the amount into two parts at a time. Pick the large amount and cut it in two

Side effect: each time points the biggest red envelope, points out more evenly

Improvements: 1) take the second largest and 2) take it at random. If there are not enough points, take something larger than it

# Method 2: Cut the bamboo

js

function * draw(cards){ const c = [...cards]; for(let i = c.length; i > 0; i--) { const pIdx = Math.floor(Math.random() * i); [c[pIdx], c[i - 1]] = [c[i - 1], c[pIdx]]; yield c[i - 1]; } } function generate(amount, count){ if(count <= 1) return [amount]; const cards = Array(amount - 1).fill(0).map((_, i) => i + 1); const pick = draw(cards); const result = []; for(let i = 0; i < count; i++) { result.push(pick.next().value); } result.sort((a, b) => a - b); for(let i = count - 1; i > 0; i--) { result[i] = result[i] - result[i - 1]; } return result; } const amountEl = document.getElementById('amount'); const countEl = document.getElementById('count'); const generateBtn = document.getElementById('generateBtn'); const resultEl = document.getElementById('result'); generateBtn.onclick = function(){ let amount = Math.round(parseFloat(amountEl.value) * 100); let count = parseInt(countEl.value); let output = []; If (isNaN (amount) | | isNaN (count) | | amount < = 0 | | count < = 0) {output. Push (' input format is not correct! '); }else if(amount < count){output.push(' output.push ')}else{output.push(... generate(amount, count)); output = output.map(m => (m / 100).toFixed(2)); } resultEl.innerHTML = '<li>' + output.join('</li><li>') + '</li>'; }Copy the code

100 yuan cut 9 cuts, from 1 to 9999 (in units), take 10 positions cut, easier to random to a larger number

Use generator, to cut the position set as 10000 cents -1 position, randomly selected a card reference shuffling, do sorting, after the position minus the previous position can get the amount of money

1. When writing code, decide what kind of code to design according to the specific scenario, pursuing performance may not be elegant enough

2. Pay attention to the efficiency of the code, write the ultimate code, grasp the readability of the code, can be improved through exercise

3. When doing projects, we need to think inductive and abstract about problems, pay attention to maintainability and expansibility, and have different solutions for different problems. Design time > coding time

4. Ensure correctness, some errors are relatively hidden, and have a positive review spirit of the code. There will be some invisible errors directly transferred to the blog