구구단은 초보자가 구구단의 기초를 익히는 데 중요한 도구이자 프로그래머가 프로그래밍 기술을 연습하기 위한 일반적인 프로젝트이기도 합니다. 이 기사에서는 JavaScript를 사용하여 간단한 구구단을 구현하는 방법을 보여 드리겠습니다.
먼저 구구단의 기본 구조를 명확히 해야 합니다. 구구단은 일반적으로 1부터 10까지의 숫자가 포함된 정사각형 테이블입니다. 각 행과 열은 이 숫자로 시작하고 해당 제품에 따라 테이블의 격자를 채웁니다.
중첩 루프를 사용하여 이 테이블을 생성할 수 있습니다. 외부 루프는 테이블의 행 수를 제어하는 데 사용되며 내부 루프는 각 행에 열을 생성하는 데 사용됩니다. 구체적인 코드는 다음과 같습니다.
for (let i = 1; i <= 10; i++) { let row = ''; for (let j = 1; j <= 10; j++) { row += (i * j) + ' '; } console.log(row); }
이 코드에서는 먼저 외부 루프를 사용하여 1부터 10까지 반복하면서 테이블의 행 수를 제어합니다. 외부 루프가 한 번 실행될 때마다 내부 루프를 사용하여 행을 생성합니다.
내부 루프는 1부터 10까지 반복됩니다. 실행될 때마다 현재 행과 열의 수를 곱하고 그 결과를 해당 행의 문자열에 추가합니다. 여기서는 ES6의 템플릿 문자열을 사용하여 문자열을 구성했으므로 문자를 사용하여 결과를 다음 결과와 구분할 수 있습니다.
마지막으로 console.log() 함수를 사용하여 각 줄을 콘솔에 출력합니다.
결과를 HTML 페이지로 인쇄하려면 이 코드를 약간 수정하면 됩니다. 특히 document.createElement() 함수를 사용하여 페이지에 테이블 요소를 만든 다음 innerHTML 속성을 사용하여 테이블에 각 행을 추가할 수 있습니다. 코드는 다음과 같습니다.
const table = document.createElement('table'); for (let i = 1; i <= 10; i++) { let row = '<tr>'; for (let j = 1; j <= 10; j++) { row += '<td>' + (i * j) + '</td>'; } row += '</tr>'; table.innerHTML += row; } document.body.appendChild(table);
이 코드에서는 document.createElement() 함수를 사용하여 table이라는 테이블 요소를 생성합니다. 외부 루프에서는 각 행을 HTML
마지막으로 이러한 HTML 요소를 body 요소에 추가하여 문서의 일부로 만듭니다.
요약하자면, 이 글에서는 JavaScript를 사용하여 간단한 구구단을 생성합니다. 콘솔에서 출력하든 웹 페이지에서 생성하든 이는 좋은 사례 프로젝트입니다. 동시에 중첩 루프를 사용하여 복잡한 데이터 구조를 생성하는 방법도 배웠습니다.
위 내용은 자바스크립트는 곱셈표를 구현합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!