2a:null 2b:["$","title",null,{"children":"Subtraction through addition: The 9's complement method | Christophe Yamahata | Observable"}] 30:T491,

One must admit that the manual method is a bit tedious, and this is especially true for subtractions.

9's complement method

With the 9's complement method, the above calculation can be solved through additions only. The following method works for A ≥ B:

Calculate A', the 9's complement of A:
[ ${addCommas(num1)} ]_9'c. → A' = ${addCommas(num1_compl)}
Complete the addition: C' = A' + B:
${addCommas(num1_compl)} + ${addCommas(num2)} = ${addCommas((Number(num1_compl)+num2).toString().padStart(num1.toString().length, "0"))}
Calculate C, the 9's complement of C':
[ ${addCommas((Number(num1_compl)+num2).toString().padStart(num1.toString().length, "0"))} ]_9'c. → C = ${addCommas(Number(res1_compl))}
(⚠ Note that the length of C' must be identical to that of A. )

You can now verify that both methods give the same result:

31:T9a1,viewof num1 = { const minReal = 1; const maxReal = 9999999999; const minLog = Math.log(minReal); const maxLog = Math.log(maxReal); const initialLogValue = Math.log(Math.max(minReal, Math.min(maxReal, num1_init))); const baseInput = Inputs.range([minLog, maxLog], { value: initialLogValue, step: "0.0000000001", label: html`Value of A
(integer, A≥1):` }); baseInput.style.width = "370px"; const labelEl = baseInput.querySelector("label"); if (labelEl) { labelEl.style.lineHeight = "1.2"; labelEl.style.display = "inline-block"; labelEl.style.verticalAlign = "middle"; } const inputEl = baseInput.querySelector("input[type=number]"); const rangeEl = baseInput.querySelector("input[type=range]"); if (inputEl) { inputEl.style.appearance = "textfield"; inputEl.style.mozAppearance = "textfield"; const styleEl = document.createElement("style"); styleEl.textContent = ` input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } `; baseInput.appendChild(styleEl); } const container = html`

${baseInput}

`; Object.defineProperty(container, "value", { get: () => Math.round(Math.exp(rangeEl.valueAsNumber)), set: (v) => { rangeEl.valueAsNumber = Math.log(Math.max(minReal, Math.min(maxReal, v))); }, configurable: true }); if (inputEl && rangeEl) { const updateText = () => { inputEl.value = container.value; }; rangeEl.addEventListener("input", updateText); updateText(); inputEl.addEventListener("keypress", (event) => { if (!/[0-9]/.test(event.key)) event.preventDefault(); }); inputEl.addEventListener("input", (event) => { let cleaned = inputEl.value.replace(/[^0-9]/g, ''); if (cleaned.trim() === "" || cleaned === "0") { inputEl.value = "1"; rangeEl.valueAsNumber = Math.log(1); container.dispatchEvent(new Event("input", { bubbles: true })); setTimeout(() => inputEl.select(), 0); return; } if (inputEl.value !== cleaned) inputEl.value = cleaned; const numericValue = Number(cleaned); rangeEl.valueAsNumber = Math.log(Math.min(maxReal, numericValue)); container.dispatchEvent(new Event("input", { bubbles: true })); }); } return container; }32:T1beb,viewof step = { const stepTimestamps = selectedTrack.timestamps; const maxStep = 3; const DEFAULT_VOLUME = 0.5; const getStepDelay = () => (typeof viewof stepDelay !== "undefined" ? viewof stepDelay.value : "audio"); const audio = new Audio(); audio.volume = DEFAULT_VOLUME; const btnStyle = "cursor:pointer; padding: 6px 12px; font-weight: bold; border-radius: 4px; border: 1px solid #cbd5e1; background: white; color: #1e293b; font-size: 13px; line-height: 1; box-sizing: border-box;"; const playBtn = html``; const firstBtn = html``; const prevBtn = html``; const nextBtn = html``; const lastBtn = html``; const volumeBtn = html``; const volumeSlider = html``; const volumeGroup = html`

${volumeBtn} ${volumeSlider}

`; const statusLabel = html``; const container = html`

${playBtn} ${firstBtn} ${prevBtn} ${nextBtn} ${lastBtn} ${volumeGroup} ${statusLabel}

`; container.value = maxStep; let timer = null; let lastVolume = DEFAULT_VOLUME; function pause() { if (timer) { clearTimeout(timer); timer = null; } audio.pause(); playBtn.textContent = "▶ Play"; playBtn.style.background = "#2563eb"; } function updateValue(val, jumpAudio = false) { const targetVal = Math.max(0, Math.min(val, maxStep)); const changed = container.value !== targetVal; container.value = targetVal; statusLabel.textContent = `Step ${container.value} / ${maxStep}`; if (changed) { container.dispatchEvent(new Event("input", { bubbles: true })); } if (jumpAudio && getStepDelay() === "audio") { const targetTime = stepTimestamps[container.value] || 0; audio.currentTime = targetTime; } } function updateVolumeIcon(val) { if (val === 0 || audio.muted) { volumeBtn.textContent = "🔇"; volumeBtn.style.color = "#dc2626"; } else { volumeBtn.textContent = val < 0.5 ? "🔉" : "🔊"; volumeBtn.style.color = "#1e293b"; } } function updateVolumeVisibility() { const isAudio = getStepDelay() === "audio"; volumeGroup.style.visibility = isAudio ? "visible" : "hidden"; volumeGroup.style.pointerEvents = isAudio ? "auto" : "none"; } function silentLoop() { const currentDelay = getStepDelay(); const delay = typeof currentDelay === "number" ? currentDelay : 1000; timer = setTimeout(() => { if (container.value >= maxStep) { pause(); return; } updateValue(container.value + 1, false); silentLoop(); }, delay); } function play() { pause(); const mode = getStepDelay(); if (mode === "audio") { const isAtEnd = audio.ended || (audio.duration && audio.currentTime >= audio.duration - 0.3); if (isAtEnd || (container.value >= maxStep && audio.currentTime === 0)) { updateValue(0, true); } else { const targetTime = stepTimestamps[container.value] || 0; if (Math.abs(audio.currentTime - targetTime) > 0.5 && audio.currentTime < targetTime) { audio.currentTime = targetTime; } } } else { if (container.value >= maxStep) { updateValue(0, false); } } playBtn.textContent = "⏸ Pause"; playBtn.style.background = "#dc2626"; if (mode === "audio") { audio.play().catch(err => { console.warn("Audio play blocked, switching to silent timer.", err); silentLoop(); }); } else { silentLoop(); } } function stepNavigate(targetStep) { if (getStepDelay() === "audio") { updateValue(targetStep, true); play(); } else { pause(); updateValue(targetStep, false); } } function jumpAndPause(targetStep) { pause(); updateValue(targetStep, true); } if (typeof audio_file !== "undefined") { audio_file.url().then(url => { audio.src = url; audio.volume = DEFAULT_VOLUME; }); } volumeSlider.oninput = (e) => { const val = parseFloat(e.target.value); audio.volume = val; audio.muted = (val === 0); if (val > 0) lastVolume = val; updateVolumeIcon(val); }; volumeBtn.onclick = () => { if (audio.muted || audio.volume === 0) { audio.muted = false; audio.volume = lastVolume || DEFAULT_VOLUME; volumeSlider.value = audio.volume; updateVolumeIcon(audio.volume); } else { audio.muted = true; volumeSlider.value = 0; updateVolumeIcon(0); } }; if (typeof viewof stepDelay !== "undefined") { const onDelayChange = () => { pause(); updateVolumeVisibility(); if (getStepDelay() !== "audio") { audio.currentTime = 0; } }; viewof stepDelay.addEventListener("input", onDelayChange); invalidation.then(() => viewof stepDelay.removeEventListener("input", onDelayChange)); } audio.ontimeupdate = () => { if (!audio.paused && getStepDelay() === "audio") { const current = audio.currentTime; let activeStep = 0; for (let i = 0; i < stepTimestamps.length; i++) { if (current >= stepTimestamps[i]) { activeStep = i; } } activeStep = Math.min(activeStep, maxStep); if (activeStep !== container.value) { updateValue(activeStep, false); } } }; audio.onended = () => { if (getStepDelay() === "audio") { pause(); } }; playBtn.onclick = () => ((!audio.paused || timer) ? pause() : play()); firstBtn.onclick = () => jumpAndPause(0); prevBtn.onclick = () => stepNavigate(container.value - 1); nextBtn.onclick = () => stepNavigate(container.value + 1); lastBtn.onclick = () => jumpAndPause(maxStep); updateValue(maxStep, false); updateVolumeIcon(DEFAULT_VOLUME); updateVolumeVisibility(); invalidation.then(() => { pause(); audio.src = ""; }); return container; }33:T611,viewof stepDelay = { const options = [ { label: "800 ms", value: 800 }, { label: "1200 ms", value: 1200 }, { label: "1500 ms", value: 1500 }, { label: "🔊 Audio", value: "audio" } ]; const radio = Inputs.radio(options, { label: html`Animation
Timing`, format: opt => opt.label, value: options[3] }); const style = document.createElement("style"); style.textContent = ` /* Style option pill buttons */ form label { display: inline-flex !important; align-items: center; gap: 4px; padding: 4px 10px; border: 1px solid #cbd5e1; border-radius: 4px; background: white; cursor: pointer; font-size: 13px; font-weight: 500; color: #334155; user-select: none; } form label:has(input:checked) { background: #2563eb; color: white; border-color: #2563eb; } form label input[type="radio"] { display: none; } /* Keep the main 'Animation timing' label transparent and undecorated */ form > label:first-child { background: transparent !important; border: none !important; padding: 0 !important; color: inherit !important; cursor: default !important; } `; radio.appendChild(style); const container = html`

${radio}

`; container.value = radio.value.value; radio.addEventListener("input", () => { container.value = radio.value.value; container.dispatchEvent(new Event("input", { bubbles: true })); }); return container; }34:T25d1,graphSvg = { const g = await graphviz; let canceled = false; invalidation.then(() => { canceled = true; }); const esc = (val) => { if (val === null || val === undefined || val === "") return ""; return String(val) .replace(/&/g, "&") .replace(//g, ">") .replace(/"/g, """) .replace(/'/g, "'"); }; const sNum1 = esc(addCommas(num1)); const sNum2 = esc(addCommas(num2)); const sDiff = esc(addCommas(num1 - num2)); const num1Len = String(num1).length; // Pad A' with leading zeros to match length of A const compl1Padded = String(num1_compl).padStart(num1Len, "0"); const sCompl1 = esc(addCommas(compl1Padded)); // Pad C' with leading zeros to match length of A const res1Padded = String(Number(num1_compl) + num2).padStart(num1Len, "0"); const sSum = esc(addCommas(res1Padded)); const sRes1Compl = esc(addCommas(Number(res1_compl))); const getDigit = (val, pos) => { try { const digit = Extract_digit(val, pos); if (digit === null || digit === undefined || digit === "") return ""; return esc(digit); } catch { return ""; } }; const dotSource = `digraph { node [shape=plaintext]; calc:A -> struct1 [label="➀ Calculate A', the 9's\\ncomplement of A\\n\\n", fontsize=12, class="step1"]; struct1 -> res1:AP [label="The 9's\\n complement of A is \\n\\n A' = ${sCompl1}", fontsize=12, class="step2"]; calc:B -> res1:PP:w [label="\\n\\n\\n ➁ Complete \\none addition: \\nA' + B = C'", fontsize=12, class="step2"]; res1:CP -> struct2 [label=" ➂ Calculate C, the 9's\\ncomplement of C'", fontsize=12, class="step3"]; struct2 -> calc:C [label=" Final result: \\n The 9's \\n complement of C' is \\n\\n C = ${sRes1Compl} ", fontsize=12, class="step3"]; compl9 -> struct1 [style=dashed, color="blue", class="step1"]; compl9 -> struct2 [style=dashed, color="blue", class="step3"]; calc [class="step0", id="calc", label=<

	*A - B = C*
		${sNum1}
	−	${sNum2}
C_result	=	${sDiff}

>]; res1 [class="step2", label=<

*A' + B = C'*
	${sCompl1}
+	${sNum2}
=	${sSum}

>]; compl9 [class="step0", label=<

9's complement table
0	1	2	3	4	5	6	7	8	9
9	8	7	6	5	4	3	2	1	0

>]; struct1 [class="step1", label=<

${getDigit(num1,9)}	${getDigit(num1,8)}	${getDigit(num1,7)}	${getDigit(num1,6)}	${getDigit(num1,5)}	${getDigit(num1,4)}	${getDigit(num1,3)}	${getDigit(num1,2)}	${getDigit(num1,1)}	${getDigit(num1,0)}	A_
${getDigit(num1_compl,9)}	${getDigit(num1_compl,8)}	${getDigit(num1_compl,7)}	${getDigit(num1_compl,6)}	${getDigit(num1_compl,5)}	${getDigit(num1_compl,4)}	${getDigit(num1_compl,3)}	${getDigit(num1_compl,2)}	${getDigit(num1_compl,1)}	${getDigit(num1_compl,0)}	C9A

>]; struct2 [class="step3", label=<

${getDigit(res1,9)}	${getDigit(res1,8)}	${getDigit(res1,7)}	${getDigit(res1,6)}	${getDigit(res1,5)}	${getDigit(res1,4)}	${getDigit(res1,3)}	${getDigit(res1,2)}	${getDigit(res1,1)}	${getDigit(res1,0)}	C_prime
${getDigit(res1_compl,9)}	${getDigit(res1_compl,8)}	${getDigit(res1_compl,7)}	${getDigit(res1_compl,6)}	${getDigit(res1_compl,5)}	${getDigit(res1_compl,4)}	${getDigit(res1_compl,3)}	${getDigit(res1_compl,2)}	${getDigit(res1_compl,1)}	${getDigit(res1_compl,0)}	C_
⚠ Zero-pad C' to match the length of A

>]; }`; let svgString; let attempts = 0; while (attempts < 2) { try { attempts++; svgString = await graphvizQueue(() => g.layout(dotSource, "svg", "dot")); if (svgString) break; } catch { if (canceled) return { stepGroups: [[], [], [], []], container: html`

` }; await new Promise(resolve => setTimeout(resolve, 80)); } } if (canceled || !svgString) { return { stepGroups: [[], [], [], []], container: html`

` }; } const parser = new DOMParser(); const svgEl = parser.parseFromString(svgString, "image/svg+xml").documentElement; const stepGroups = [0, 1, 2, 3].map(n => [...svgEl.querySelectorAll(`.step${n}`)]); const calcTitle = [...svgEl.querySelectorAll("title")].find(t => t.textContent === "calc"); const calcGroup = calcTitle?.parentElement; if (calcGroup) { const children = [...calcGroup.children]; const resultText = children.filter(el => el.tagName === "text").pop(); if (resultText) stepGroups[3].push(resultText); } const replacements = [ { find: "A_", tex: tex`\leftarrow A` }, { find: "C9A", tex: tex`{\hookrightarrow A' = \complement_{9}\big(A\big)}` }, { find: "C_prime", tex: tex`{\leftarrow C'}` }, { find: "C_", tex: tex`{\hookrightarrow C = \complement_{9}\big(C'\big)}` }, { find: "C_result",tex: tex`{C = \complement_{9}\Big( \complement_{9}\big(A\big) + B \Big)}` }, ]; const temp = document.createElement("div"); temp.style.cssText = "position:fixed; left:-9999px; top:-9999px; opacity:0; pointer-events:none;"; document.body.appendChild(temp); try { temp.appendChild(svgEl); for (const { find, tex: math } of replacements) { const textNode = [...svgEl.querySelectorAll("text")].find(t => t.textContent.trim() === find); if (textNode) { const { x, y } = textNode.getBBox(); const fo = document.createElementNS("http://www.w3.org/2000/svg", "foreignObject"); fo.setAttribute("x", x); fo.setAttribute("y", y); fo.setAttribute("width", 220); fo.setAttribute("height", 22); const wrapper = document.createElement("div"); wrapper.style.cssText = "display:flex; align-items:center; height:100%; font-size:13px;"; wrapper.append(math); fo.append(wrapper); textNode.replaceWith(fo); if (find === "C_result") stepGroups[3].push(fo); } } } finally { if (temp.parentNode) document.body.removeChild(temp); } svgEl.querySelectorAll("title").forEach(t => t.remove()); stepGroups.flat().forEach(el => { el.style.transition = "opacity 0.4s ease-in-out"; }); const container = html`

${svgEl}

`; return { stepGroups, container }; }35:T68a,audioTracks = new Map([ [ "Liam (Energetic)", { file: FileAttachment("ElevenLabs_2026-07-27T17_08_45_Liam - Energetic, Social Media Creator_pre_sp109_s80_sb100_v3_b.mp3"), timestamps: [0, 15, 20, 31.2] } ], [ "Chris (Charming)", { file: FileAttachment("ElevenLabs_2026-07-27T17_03_55_Chris - Charming, Down-to-Earth_pre_sp100_s50_sb75_se0_b_m2.mp3"), timestamps: [0, 15.2, 21.1, 32] } ], [ "Mark", { file: FileAttachment("ElevenLabs_2026-07-27_Mark.mp3"), timestamps: [0, 16.8, 23, 37.1] } ], [ "Spuds Oxley", { file: FileAttachment("ElevenLabs_2026-07-27_Spuds_Oxley.mp3"), timestamps: [0, 20.5, 28.1, 43.4] } ], [ "Arabella", { file: FileAttachment("ElevenLabs_2026-07-27_Arabella.mp3"), timestamps: [0, 17.1, 23.2, 36.6] } ], [ "Jessica Anne Bogart", { file: FileAttachment("ElevenLabs_2026-07-27_Jessica_Anne_Bogart.mp3"), timestamps: [0, 16, 22, 34.5] } ], [ "Paul K [\u{1F1EB}\u{1F1F7}]", { file: FileAttachment("ElevenLabs_2026-07-27_Paul_K_(FR)@1.mp3"), timestamps: [0, 17.4, 23.2, 36.4] } ], [ "Lucie [\u{1F1EB}\u{1F1F7}]", { file: FileAttachment("ElevenLabs_2026-07-28T17_46_36_Lucie - Support Agent_pvc_sp102_s50_sb75_v3.mp3"), timestamps: [0, 17.9, 24.1, 37.4] } ], [ "Samayra [हिं (Hindi)]", { file: FileAttachment("ElevenLabs_2026-07-28T18_53_53_Samayra - Velvety Romantic Narrator_pvc_sp100_s50_sb75_se0_b_m2.mp3"), timestamps: [0, 20, 25.4, 38.5] } ] ])36:T49b,layout = { let _id = 0; return function(layout) { return function * (parts, ...args) { yield html`

...loading...

`; const str = parts.map((s, i) => s + (i < args.length ? args[i] : "")).join(""); const svg = graphviz.layout(str, "svg", layout); const id = ++_id; yield html`\

${svg}

`; setTimeout((id) => { var svg = d3.select(`#id_${id}`).select("svg") .attr("width", `${width}px`) ; var g = svg.select("g"); var [x, y, _width, height] = svg.attr("viewBox").split(" "); var zoom = d3.zoom(); svg.call(zoom .extent([[0, 0], [width, height]]) .scaleExtent([0.1, 8]) .on("zoom", ({ transform }) => g.attr("transform", transform)) ); svg.call(zoom.translateTo, width / 2, -height / 2); }, 1000, id); } } }37:[{"id":"de3a169f76fd09198605aa58700cc092b911135c8d984f810394fa3dbef7cfba5acbadeb1f1295ffb1d5b4f1f0693f0a452f84849c930910b44581fd46b1f9e3","href":"https://static.observableusercontent.com/files/de3a169f76fd09198605aa58700cc092b911135c8d984f810394fa3dbef7cfba5acbadeb1f1295ffb1d5b4f1f0693f0a452f84849c930910b44581fd46b1f9e3","name":"ElevenLabs_2026-07-27T17_08_45_Liam - Energetic, Social Media Creator_pre_sp109_s80_sb100_v3_b.mp3","type":"audio/mpeg","lastModified":1785172759820.495,"size":673812},{"id":"8cd903b14b6b368647f98297b1964d7667b94bbba38d2bed5a59e720702d6ac47891cff376578504b8ad744b98d21e058f3d80f1b0a6ecc3e65ce9c58db67bda","href":"https://static.observableusercontent.com/files/8cd903b14b6b368647f98297b1964d7667b94bbba38d2bed5a59e720702d6ac47891cff376578504b8ad744b98d21e058f3d80f1b0a6ecc3e65ce9c58db67bda","name":"ElevenLabs_2026-07-28T18_53_53_Samayra - Velvety Romantic Narrator_pvc_sp100_s50_sb75_se0_b_m2.mp3","type":"audio/mpeg","lastModified":1785265068412.79,"size":843480},{"id":"09bdcceb3daeb7effafbdb101d0ca0f4c78e0ce33538457fa2f6e5776b0e5112c5b54a55bce58954e63d1d7a9068a766bfc3556b0961dffc0ddfc0b29393d5a1","href":"https://static.observableusercontent.com/files/09bdcceb3daeb7effafbdb101d0ca0f4c78e0ce33538457fa2f6e5776b0e5112c5b54a55bce58954e63d1d7a9068a766bfc3556b0961dffc0ddfc0b29393d5a1","name":"ElevenLabs_2026-07-27T17_03_55_Chris - Charming, Down-to-Earth_pre_sp100_s50_sb75_se0_b_m2.mp3","type":"audio/mpeg","lastModified":1785250592663.21,"size":703464},{"id":"af7a01ee6232709afaadac43001da9a8541e847cde0c45510ef2c59764b4e3e0fd6c3769b55c04b41904090bd5486d8c833f5fa739f1bb0679f89e1481ebb8af","href":"https://static.observableusercontent.com/files/af7a01ee6232709afaadac43001da9a8541e847cde0c45510ef2c59764b4e3e0fd6c3769b55c04b41904090bd5486d8c833f5fa739f1bb0679f89e1481ebb8af","name":"ElevenLabs_2026-07-27_Arabella.mp3","type":"audio/mpeg","lastModified":1785253724609.635,"size":1939200},{"id":"6cb311d50b495a5c6469b329b9bd3d4a519d6e2652f94dcca452b782cda17b30623951d6d9d8fdbb40a25f7ac4971c8aa68e52dfbbc3640368050251aabcc66c","href":"https://static.observableusercontent.com/files/6cb311d50b495a5c6469b329b9bd3d4a519d6e2652f94dcca452b782cda17b30623951d6d9d8fdbb40a25f7ac4971c8aa68e52dfbbc3640368050251aabcc66c","name":"ElevenLabs_2026-07-27_Spuds_Oxley.mp3","type":"audio/mpeg","lastModified":1785252409343.225,"size":2330880},{"id":"c53b53f0c08d23253b4de127e4f28917cefeed238607e14ddb8212037e1d20a30e58c10812d2725a9afe7695aa3e0de18b53c62265bccc814c8c0a200ee20c9b","href":"https://static.observableusercontent.com/files/c53b53f0c08d23253b4de127e4f28917cefeed238607e14ddb8212037e1d20a30e58c10812d2725a9afe7695aa3e0de18b53c62265bccc814c8c0a200ee20c9b","name":"ElevenLabs_2026-07-27_Jessica_Anne_Bogart.mp3","type":"audio/mpeg","lastModified":1785254458681.127,"size":1825920},{"id":"948f809f33de18aaf157c95d071e44a69c09f7e0da0124df3e6070185622ab98c94cbe16968781505ac81f9e4a73c5afcc43c20eda0246b608f16c5cd28599cc","href":"https://static.observableusercontent.com/files/948f809f33de18aaf157c95d071e44a69c09f7e0da0124df3e6070185622ab98c94cbe16968781505ac81f9e4a73c5afcc43c20eda0246b608f16c5cd28599cc","name":"ElevenLabs_2026-07-27_Mark.mp3","type":"audio/mpeg","lastModified":1785257322260.731,"size":1930560},{"id":"61c664cf568fc9ea893215f0ecfddc9d1cee1946c5c187f9d228bdbe8b25671c72362e239b41895f9110cb80784e723b86e70ac1cb65d7dacffdda3470834050","href":"https://static.observableusercontent.com/files/61c664cf568fc9ea893215f0ecfddc9d1cee1946c5c187f9d228bdbe8b25671c72362e239b41895f9110cb80784e723b86e70ac1cb65d7dacffdda3470834050","name":"ElevenLabs_2026-07-28T17_46_36_Lucie - Support Agent_pvc_sp102_s50_sb75_v3.mp3","type":"audio/mpeg","lastModified":1785261044457.588,"size":791259},{"id":"0ddba20054637bf337a78a1ef20a0630474d9b8fb0b1bf2379c1ce617b6e6e893b58f0690bf85db1055ff6fe87fe7f1e79094ea50c14683289dd5873ed0be26c","href":"https://static.observableusercontent.com/files/0ddba20054637bf337a78a1ef20a0630474d9b8fb0b1bf2379c1ce617b6e6e893b58f0690bf85db1055ff6fe87fe7f1e79094ea50c14683289dd5873ed0be26c","name":"ElevenLabs_2026-07-27_Paul_K_(FR)@1.mp3","type":"audio/mpeg","lastModified":1785260109334.014,"size":1855680},{"id":"d4c4c380c7745bfc3baa97dee82675d3ba26be37076be68a067348bae9078dedc2dd3f8c8fb38f31a49097c77eb81dfd2569b38c53a8bfb5f156f4cb21b7bb22","href":"https://static.observableusercontent.com/files/d4c4c380c7745bfc3baa97dee82675d3ba26be37076be68a067348bae9078dedc2dd3f8c8fb38f31a49097c77eb81dfd2569b38c53a8bfb5f156f4cb21b7bb22","name":"graphviz.js","type":"application/javascript","lastModified":1705006498255.886,"size":659747}] 2e:{"id":"6bccd16e81959240","slug":"subtraction-through-addition-the-9s-complement-method","title":"Subtraction through addition: The 9's complement method","thumbnail":"4e5c2b77d2aa7652ea0d50267e7977bd5220c7974496bf1f8eae762c24ea206a","access_level":"public","create_time":"$D2022-08-01T10:18:03.997Z","update_time":"$D2026-07-28T19:03:55.347Z","view_time":null,"first_public_time":"$D2022-08-01T19:18:48.934Z","has_unpublished_edits":null,"fork":false,"stars":6,"starred":false,"owner":{"type":"team","id":"dd67891d326bcfb1","login":"christophe-yamahata","name":"Christophe Yamahata","avatar_url":"https://avatars-next.observableusercontent.com/8256ac716aa8395babba412b2835913d186874fa4190df57a4a28f2e60129876","tier":"starter_2024"},"version":2235,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"06f083eba60f5a76","login":"christophe-yamahata","name":"Christophe Yamahata","avatar_url":"https://avatars-next.observableusercontent.com/8256ac716aa8395babba412b2835913d186874fa4190df57a4a28f2e60129876","tier":null}],"members":[{"type":"individual","id":"06f083eba60f5a76","login":"christophe-yamahata","name":"Christophe Yamahata","avatar_url":"https://avatars-next.observableusercontent.com/8256ac716aa8395babba412b2835913d186874fa4190df57a4a28f2e60129876","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":{"id":"19262496cb287a16","slug":"mathematics","title":"Mathematics","owner":{"id":"dd67891d326bcfb1","login":"christophe-yamahata","name":"Christophe Yamahata"}},"type":"notebook","body":{"title":"Subtraction through addition: The 9's complement method","cells":[{"id":0,"value":"# Subtraction through addition: The 9's complement method","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":147,"value":"

\n Add to subtract — Computers perform additions to complete subtractions. What about humans?\n Humans are lazy: Whenever they can, even for very simple operations, they use a calculator. \n
Q.E.D. (quod erat demonstrandum): Without really knowing it, we add to substract.\n

\n In this notebook, rather than explaining the binary system of computers, I will show how one can easily \n perform subtractions using additions, and this will be done in the familiar decimal system.\n

\n
\n

Substration with pencil and paper

\nWhat is the result of the following subtraction? \n

\n","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":130,"value":"tex.block` \nA \\; - \\; B = \\quad ${addCommas(num1)} \\; - \\; ${addCommas(num2)} \\; = \\quad ? \n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":227,"value":"

Well, wait … Here is a more challenging question: Would you be ready to complete this calculation without a calculator?\nIf so, try to solve it with the pencil and paper method. You should find the following result:\n

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":105,"value":"tex.block` \n\n\\def\\arraystretch{1.5}\n \\begin{array}{lr}\n & ${addCommas(num1)} \\\\\n - & ${addCommas(num2)} \\\\\n \\hline\n + & ${addCommas(num1-num2)}\n\\end{array}\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":221,"value":"$30","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":487,"value":"tex.block` \n \\begin{array}{rl}\n A \\; - \\; B &=& C \\\\\n ${addCommas(num1)} \\; - \\; ${addCommas(num2)} \\; &=& ${addCommas(Number(res1_compl))}\n \\end{array}\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1238,"value":"In mathematical notation, this approach (referred to as the *first method of complements*) breaks down as:\n${tex.block`\n\\begin{aligned}\n A - B &= \\complement_{9}\\Big( {\\color{#aaa}\\underbrace{\\color{black}\\complement_{9}\\big(A\\big)}_{A'}} + B \\Big) \\\\[14pt]\n &= \\complement_{9}\\big( {\\color{#aaa}\\underbrace{\\color{black}A' + B}_{C'}} \\big) \\\\[14pt]\n &= {\\color{#aaa}\\underbrace{\\color{black}\\complement_{9}\\big(C'\\big)}_{C}} \\\\[14pt]\n &= C\n\\end{aligned}\n`}","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":522,"value":"
\n

Try it yourself: change the parameters for A and B

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":298,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":306,"value":"viewof num2 = {\n const input = Inputs.range([0, num1], {\n value: num1 == num1_init \n ? Math.min(num1, num2_init) \n : Math.floor(Math.random() * (num1 + 1)), \n step: 1, \n label: html`Value of B
(integer, B ≤ A):`\n });\n input.style.width = \"370px\";\n\n const inputEl = input.querySelector(\"input[type=number]\");\n \n if (inputEl) {\n inputEl.addEventListener(\"keypress\", (event) => {\n if (!/[0-9]/.test(event.key)) {\n event.preventDefault();\n }\n });\n\n inputEl.addEventListener(\"input\", (event) => {\n if (event.isTrusted === false) return;\n\n let cleaned = inputEl.value.replace(/[^0-9]/g, '');\n\n if (cleaned.trim() === \"\") {\n inputEl.value = \"0\";\n input.value = 0;\n setTimeout(() => inputEl.select(), 0);\n return;\n }\n \n if (inputEl.value !== cleaned) {\n inputEl.value = cleaned;\n }\n \n input.value = Math.min(num1, Number(cleaned));\n });\n }\n \n return input;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1012,"value":"graph = {\n const { stepGroups, container } = graphSvg;\n stepGroups.forEach((els, i) => els.forEach(el => (el.style.opacity = i <= step ? 1 : 0)));\n return container;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2075,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1017,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2109,"value":"viewof selectedTrack = Inputs.select(audioTracks, {\n label: html`Voiceover Track
(ElevenLabs)`\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"---\n## Appendix","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":49,"value":"num1_init = 992865413","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":53,"value":"num2_init = 72818724","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":200,"value":"num1_compl = Complement_9(num1).toString().padStart(num1.toString().length, \"0\");","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":513,"value":"res1 = (Number(num1_compl)+num2).toString().padStart(num1.toString().length, \"0\");","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":214,"value":"res1_compl = Complement_length(res1, num1.toString().length)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":58,"value":"result = num1-num2","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":996,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2102,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1965,"value":"audio_file = selectedTrack.file","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":537,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10,"value":"\ngraphviz = GraphvizModule.Graphviz.load();\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1887,"value":"graphvizQueue = {\n let lock = Promise.resolve();\n return function run(fn) {\n const next = lock.then(fn, fn);\n lock = next.catch(() => {});\n return next;\n };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":786,"value":"// GraphvizModule = import ('@hpcc-js/wasm/dist/graphviz');\nGraphvizModule = import(await FileAttachment(\"graphviz.js\").url())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"dot = layout(\"dot\");","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":61,"value":"function addCommas(nStr) {\n nStr += '';\n var x = nStr.split('.');\n var x1 = x[0];\n var x2 = x.length > 1 ? '.' + x[1] : '';\n var rgx = /(\\d+)(\\d{3})/;\n while (rgx.test(x1)) {\n x1 = x1.replace(rgx, '$1' + '\\´' + '$2');\n }\n return x1 + x2;\n}\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":577,"value":"// This functions adds 9s to n if n has a smaller length than l \nComplement_length = function(n, l) {\n var target = l.toString().length;\n var str = n.toString().padStart(target, '0'); // pad FIRST\n var result = '';\n\n for (var i = 0; i < str.length; i++) {\n result += (9 - parseInt(str[i], 10)).toString();\n }\n\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":278,"value":"// Function to find (b-1)'s complement of a number with any base b\nfunction Complement_9(n) {\n var maxDigit, b = 10, maxNum = 0, digits = 0, num = n; // b = 10 (base 10)\n \n // Calculate the number of digits in the given number\n while (n != 0) {\n digits++;\n n = parseInt(n / 10);\n }\n \n // Largest digit in the number\n // system with base b\n maxDigit = b - 1;\n \n // Largest number in the number\n // system with base b\n while ((digits--) > 0) {\n maxNum = maxNum * 10 + maxDigit;\n }\n \n // return Complement\n return maxNum - num;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":423,"value":"function Extract_digit(n, pos) {\n try {\n const s = String(n ?? \"\").trim();\n if (pos < 0 || pos >= s.length) return \"\";\n return s[s.length - 1 - pos];\n } catch {\n return \"\";\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W37","stdlib":"1","titling":"auto"}} 2f:"$2e:body"