Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Fetching contributors…

Cannot retrieve contributors at this time

101 lines (100 sloc) 4.621 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 jQuery.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.