Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Fetching contributors…

Cannot retrieve contributors at this time

101 lines (100 sloc) 5.705 kb
<!DOCTYPE html>
<html data-require="math graphie graphie-helpers math-format word-problems">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Distributive property</title>
<script src="../khan-exercise.js"></script>
</head>
<body>
<div class="exercise">
<div class="problems">
<div id="evaluate">
<div class="vars">
<var id="A, B, C">randRangeUnique( 2, 10, 3 )</var>
<var id="RESULT">A * ( B + C )</var>
</div>
<p class="question">Use distribution to solve:</p>
<p><code><var>A</var>\times(<var>B</var> + <var>C</var>)</code></p>
<p class="solution" data-forms="integer"><var>RESULT</var></p>
<div class="hints">
<div>
<p>Each row has <code><var>B</var> + <var>C</var> = <var>B+C</var></code> rectangles, and there are <code><var>A</var></code> rows.</p>
<div class="graphie" id="distrib">
init({
range: [ [ 0, 1 ], [ 0, A ] ],
scale: [ 180, 30 ]
});
rectchart( [ B, C ], [ "#FFA500", "#6495ED" ], A - 1 );
for ( var i = 0; i &lt; A - 1; i++ ) {
rectchart( [ B, C ], [ "#FFCF22", "#85B7FF" ], i);
}
</div>
</div>
<p style="font-weight: bold">Counting by color:</p>
<p>Number of orange rectangles: <code><var>A</var> \times <var>B</var> = <var>A * B</var></code></p>
<p>Number of blue rectangles: <code><var>A</var> \times <var>C</var> = <var>A* C</var></code></p>
<p>Total number of rectangles: <code><var>A * B</var> + <var>A * C</var> = <var>RESULT</var></code></p>
<p style="font-weight: bold">Counting by row:</p>
<p>Number of rows: <code><var>A</var></code></p>
<p>Number of rectangles in a row: <code><var>B</var> + <var>C</var> = <var>B + C</var></code></p>
<p>Total number of rectangles: <code><var>A</var> \times <var>B + C</var> = <var>RESULT</var></code></p>
<div>
<p>Both ways of counting result in the same number, and this is known as the distributive property.</p>
<p><code>(<var>A</var> \times <var>B</var>) + (<var>A</var> \times <var>C</var>) = <var>A</var>\times(<var>B</var> + <var>C</var>)</code></p>
</div>
</div>
</div>
<div id="replace-symbol">
<div class="vars">
<var id="NUMS">randRangeUnique( 2, 10, 3 )</var>
<var id="A, B, C">NUMS</var>
<var id="RESULT">A * ( B + C )</var>
<var id="SYMBOL">binop( 1 )</var>
<var id="SWAP_INDEX">randRange( 0, 2 )</var>
<var id="SYM_A, SYM_B, SYM_C">
(function() {
return $.map( NUMS, function( el, i ) {
if ( i === SWAP_INDEX ) {
return SYMBOL;
} else {
return el;
}
});
})()
</var>
<var id="MISSING">NUMS[ SWAP_INDEX ]</var>
</div>
<p class="question">Using the picture below as a guide, what number could replace <code><var>SYMBOL</var></code>?</p>
<p><code><var>A</var>\times(<var>B</var> + <var>C</var>) = ( <var>SYM_A</var> \times <var>SYM_B</var> ) + ( <var>SYM_A</var> \times <var>SYM_C</var> )</code></p>
<div class="graphie" id="distrib">
init({
range: [ [ 0, 1 ], [ 0, A ] ],
scale: [ 180, 30 ]
});
rectchart( [ B, C ], [ "#FFA500", "#6495ED" ], A - 1 );
for ( var i = 0; i &lt; A - 1; i++ ) {
rectchart( [ B, C ], [ "#FFCF22", "#85B7FF" ], i);
}
</div>
<p>There are <code><var>A</var></code> rows, and each row has <code><var>B</var> + <var>C</var> = <var>B+C</var></code> rectangles.</p>
<p class="solution" data-forms="integer"><var>MISSING</var></p>
<div class="hints">
<p style="font-weight: bold">Counting by color:</p>
<p>Number of orange rectangles: <code><var>A</var> \times <var>B</var> = <var>A * B</var></code></p>
<p>Number of blue rectangles: <code><var>A</var> \times <var>C</var> = <var>A* C</var></code></p>
<p>Total number of rectangles: <code><var>A * B</var> + <var>A * C</var> = <var>RESULT</var></code></p>
<p style="font-weight: bold">Counting by row:</p>
<p>Number of rows: <code><var>A</var></code></p>
<p>Number of rectangles in a row: <code><var>B</var> + <var>C</var> = <var>B + C</var></code></p>
<p>Total number of rectangles: <code><var>A</var> \times <var>B + C</var> = <var>RESULT</var></code></p>
<div>
<p>Both ways of counting result in the same number, and this is known as the distributive property.</p>
<p><code>(<var>A</var> \times <var>B</var>) + (<var>A</var> \times <var>C</var>) = <var>A</var>\times(<var>B</var> + <var>C</var>)</code></p>
<p>Thus the symbol <code><var>SYMBOL</var></code> could be replaced with <code><var>MISSING</var></code>.</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.