<230104 1교시>
function 함수명(매개변수1, 매개변수2) {
--> 매개변수는 function 안에서만 사용
}
return( ) : 함수를 통해 처리된 결과를 반환시켜주는 함수 [ page353.html ]
<230104 2교시>
배열(Array)함수 사용 이유 : 반복문 안에서 변수처리할 때
ㄴ> 변수 --> 객체로 표현함 : index
객체명.length --> 방(객체) 개수 (변수에선 안뜸)
ㄴ> for(i=0; i< 객체명.length; i++) 으로 주로 사용됨
객체 반복문 돌릴때 무조건 <(작다) 로 해야함
<230104 3~4교시 피라미드>
<230104 5교시 date() 함수>
now.get : 출력을 하겠다 의미
now.set :
document 꾸미기
--> document.body.style.background = "red";
문자열 추가 : .concat( );
<230104 6교시>
[ string_03.html ]
hip 영역(주소창가짐) stack 영역
- a 변수 : 1 2 3 4
- b 객체(b@~~~~) - b 변수 : 1 / 2 / 3 / 4
- c 객체(c@~~~~) - c 변수 : 12 / 34
- d 객체(d@~~~~) - d 변수 : 1 / 2 / 3 / 4
객체일 때 사용 가능(메소드 = 이미 만들어진 함수)
--> .length : 방 개수
--> .concat : 문자열 합치기
--> .replace : 변경
--> .trim : 맨앞, 맨뒤 공백 없애기
--> .split : 어떤 기준으로 분할
--> .charAt : index 기준으로 그 해당 문자 반환
*객체는 배열 기준으로 !! *
Math --> 수학적인 상수와 함수를 위한 속성과 메서드 가진 객체
--> .sqrt : 루트
--> .random : 0.000~ 0.999~ 사이값으로 랜덤으로 나옴
--> .floor =parseInt
page353.html
<script>
function c(x,y) { // 함수 함수명(매개변수1, 매개변수2)
console.log("두 수의 합 : "+(x+y));
}
// c() ; c함수 실행하시오.
</script>
<span onclick="c(1,3);">덧셈 실행</span>
<br>
<script>
function a(i,j) { // return 이용해서 작성
return i+j;
}
document.write(a(1,3));
///////////////////////////////////////////
function a(i,j) { // return 이용해서 작성
var cc = i+j;
return cc;
}
document.write(a(1,3));
////////////////////////////////////////////
function a(i,j) { // return 이용해서 작성
return i+"+"+j+"="+(i+j)+"<br>";
}
document.write(a(1,3));
///////////////////////////////////////////
function b(i,j) { // return 없이 작성
document.write(i+j);
}
b(1,3);
</script>
<a href="javascript:a(1,3);">더하기 실행</a>
<br><br><br>
<script>
function grade2(s1, s2) {
var avg = (s1 + s2)/2;
return avg; // 평균값
}
</script>
<div onclick="console.log(grade2(90,80));">계산</div>
<a href="javascript:console.log(grade2(90,80));">계산</a>
page361.html
<script>
var x = Number(prompt("국어 점수를 입력하세요",""));
var y = Number(prompt("영어 점수를 입력하세요",""));
var z = Number(prompt("수학 점수를 입력하세요",""));
function a() {
var sum = x+y+z;
var avg = (x+y+z)/3;
document.write("국어: "+x+"<br>");
document.write("영어: "+y+"<br>");
document.write("수학: "+z+"<br>");
document.write("평균: "+avg+"<br>");
document.write("총합: "+sum+"<br>");
}
</script>
<!--
<script>
// 키보드 3개의 입력값을 받는다
// 국, 영, 수 (0-100)
/*
function a(i,j) { // return 이용해서 작성
var cc = i+j;
return cc;
}
document.write(a(1,3));
*/
var x = prompt("국어 점수를 입력하세요","")
var y = prompt("영어 점수를 입력하세요","")
var z = prompt("수학 점수를 입력하세요","")
function a(q,w,e) {
document.write(x,y,z); // 각 과목의 점수를 출력
var avg = (x+y+z)/3; // 평균점수 출력
return avg;
var sum = x+y+z; // 총 합의 점수 출력
return sum;
}
a(x,y,z); // 3개의 값을 전달하자
</script>
-->
page387.html
<script>
// 배열
var c = ["서울","대전","대구","부산"];
c[5] = "제주";
for(i=0; i<c.length; i++) { // c.length = 4
document.write(c[i]+"<br>");
}
/*
c[0]; // 서울
c[1]; // 대전
c[2]; // 대구
c[3]; // 부산
*/
var v = new Array(10,20,30);
document.write(v[0]+"<br>"); // 10
document.write(v[1]+"<br>"); // 20
document.write(v[2]+"<br>"); // 30
/////////////////////////////////////////
var num = [4,5,-2,26,33];
sum = 0;
for(i=0; i<num.length; i++) {
sum += num[i];
}
document.write(sum);
</script>
array_02.html
<script>
var num = [2,5,3,4,6];
for(i=0; i<num.length; i++) { //층
for(j=1; j<=num[i]; j++) { // 방
document.write("*");
}
document.write("<br>");
}
/* 쌤
var num = [2,5,3,4,6];
for(i=0; i<num.length; i++) { //층
for(j=0; j<num[i]; j++) { // 방
document.write("*");
}
document.write("<br>");
}
*/
</script>
array_03.html
<script>
// 몇개의 점수를 받을지 입력 받는다 (4개) --> 반복문 안에
// 갯수 만큼 점수를 입력 받는다
// 각각의 점수 출력
// 총합 출력
// 평균값 출력
var a = new Array(); // 배열 선언만 하는 경우
var num = parseInt(prompt("몇개의 점수를 받을래?",""));
var sum = 0; // 총점
for(i=0; i<num; i++) { // prompt 갯수만큼 반복
a[i] = parseInt(prompt("점수",""));
sum += a[i];
document.write((i+1)+"번째 점수 : " + a[i] + "<br>");
}
document.write("총점 : " + sum + "<br>");
document.write("평균 : " + (sum/num) + "<br>");
</script>
array_04.html
<script>
// 숫자를 입력받는다
// 숫자 만큼의 피라미드 구조를 출력하자
/*
var num = parseInt(prompt("숫자를 입력하세요",""));
for(i=1; i<=num; i++) { // 층
for(j=1; j<=i; j++) { // 방
document.write("*");
}
document.write("<br>");
}
*/
/* 0부터 시작한다면!
var num = parseInt(prompt("숫자를 입력하세요",""));
for(i=0; i<num; i++) { // 층
for(j=0; j<=i; j++) { // 방
document.write("*");
}
document.write("<br>");
}
*/
// 피라미드 위아래로
var num = parseInt(prompt("숫자를 입력하세요",""));
for(i=1; i<=num; i++) { // 층
for(j=1; j<=i; j++ ) { // 방
document.write("*");
}
document.write("<br>");
}
for(i=num-1; i>=1; i--) { // 층
for(j=1; j<=i; j++ ) { // 방
document.write("*");
}
document.write("<br>");
}
</script>
array_05.html
<script>
// 반대로 된 피라미드
/*
var num = parseInt(prompt("숫자를 입력하세요",""));
for(i=1; i<=num; i++) { // 층
for(k=num-i; k>=0; k--) { //
document.write(" ");
}
for(j=1; j<=i; j++) {
document.write("*");
}
document.write("<br>")
}
*/
// 1,3,5, 등 홀수 단위로 피라미드
var num = parseInt(prompt("피라미드 몇층?",""));
for(i=0; i<num; i++) { // 층
for(k=num-i; k>0; k--) { //
document.write(" ");
}
var td = i*2+1; // 1,3,5,7,9 등 나오게
for(j=1; j<=td; j++) { // 방
document.write("*");
}
document.write("<br>");
}
</script>
date_01.html
<script>
var now = new Date();
var year = now.getFullYear(); // 년
var month = now.getMonth()+1 ; // 월 (0-11까지의 값을 가지고 있음)
var day = now.getDate(); // 일
var day2 = now.getDay(); // 요일 단위를 숫자로 표기 (일-월 : 0-6)
document.write(year+"<br>"); //2023
document.write(month+"<br>"); //1
document.write(year + "년 " + month+ "월" +"<br>"); // 2023년 1월
document.write(day+"일"+"<br>");
var day3 = "";
if(day2 == 0) {
day3 = "일요일";
} else if(day2 == 1) {
day3 = "월요일";
} else if(day2 == 2) {
day3 = "화요일";
} else if(day2 == 3) {
day3 = "수요일";
} else if(day2 == 4) {
day3 = "목요일";
} else if(day2 == 5) {
day3 = "금요일";
} else if(day2 == 6) {
day3 = "토요일";
}
document.write(day+"일 "+day3+"<br>");
document.write(year + "년 " + month+ "월 " + day+"일 "+day3+"<br>");
/////////////////////////////////////////
var hour = now.getHours(); // 시
var minute = now.getMinutes(); // 분
var second = now.getSeconds(); // 초
var millisecond = now.getMilliseconds(); // 1/1000 초
document.write(hour+"시"+"<br>");
document.write(minute+"분"+"<br>");
document.write(second+"초"+"<br>");
document.write(millisecond+"밀리언초"+"<br>");
document.write(hour + "시 " + minute + "분 " + second +"초 "+"<br>");
document.body.style.background = "red";
// 짝수 초일 때 red, 홀수 초일 때 blue;
if(second % 2 ==0) {
document.body.style.background = "red";
} else {
document.body.style.background = "blue";
}
</script>
string_01.html
<script>
var hello = new String("나는 규태다."); // 객체
var hello2 = "나도 규태다."; // hello2 변수에 문자열 들어감(위와 동일한 역할함)
document.write(hello2.length+"<br>"); // 7(한글자씩, 띄어쓰기도 포함)
for(i=0; i<hello.length; i++) {
document.write(hello[i]+"<br>");
}
var num = "나는 규태다.".length; //7
var num = "나는 규태다."
num.length; //7
///////////////////////////////////////////////
// concat()
var a ="예진이는 ";
a = a + "예쁘다.";
a = a.concat("정말로..."); //문자열 추가하고싶을 때
document.write(a);
</script>
string_02.html
<script>
//////문자열 자르기 위한 함수들///////////////////
var every = "boysandgirls"; // 객체 every에 문자열 들어가있음(0-12)
var index = every.indexOf("and"); // every에 적힌 문자열 중에 and 가 몇번방에 있느냐 = 4
// index : [0]~[12] 임
var a = every.slice(5,8);
var b = every.substr(5,3);
var c = every.substring(5,8);
document.write(index + "<br>");
document.write(a + "<br>"); // index 5에서 8 이전의 문자열을 자를 때 사용
document.write(b + "<br>"); // index 5에서부터 3개의 문자열을 가져오겠다(제일 많이 사용)
document.write(c + "<br>"); // index 5에서 8 이전의 문자열
</script>
string_03.html
<script>
var a = 1234;
var b = new String("1234");
var c = new Array("12","34");
var d = new Array("1","2","3","4");
///////////////////////////////////////
var e = "Boys and Girls"; // 문자열이므로 객체
document.write("기본값 : "+e+"<br>");
var aa = e.replace("and", "or"); // 변경할 때
document.write(aa+"<br>");
document.write(e+"<br>"); // 기존 값은 변경 안됨
var bb = e.toUpperCase(); // 대문자로 모두 변경
document.write(bb+"<br>");
var cc = e.toLowerCase(); // 소문자로 모두 변경
document.write(cc+"<br>");
</script>
string_04.html
<script>
document.write("===<br>")
var str = " abc ";
for(i=0; i<str.length; i++) {
document.write(str[i]+"<br>");
}
document.write("===<br>")
var a = str.trim(); // 문장의 맨앞, 맨뒤 공백 없애기3
// a = "abc";
for(i=0; i<a.length; i++) {
document.write(a[i]+"<br>");
}
</script>
아이디 : <input name="id">
string_05.html
<script>
var a = "Boys and Girls";
var b = "dancepkt@nate.com";
var c = b.split("@"); // c[0] : dancepkt, c[1] : nate.com
var d = a.split(" "); // d[0] : Boys, d[1] : and, d[2] : Girls
for(i=0; i<d.length; i++) {
document.write(d[i]+"<br>");
}
document.write(a.charAt(2)+"<br>"); // y (index 기준으로 n번째 문자 반환)
</script>
이메일 <input name="email1" value="">@<input name="email2" value="">
math_01.html
<script>
var sq = Math.sqrt(4); // 루트 (2)
// const PI = 3.14 // 이미 값이 내정되어있음(값 변경 X)
var a = 3 * 3 * Math.PI; // 원의 넓이
document.write(sq+"<br>");
document.write(a+"<br>");
var s = Math.random(); //0.0000000000000000000 ~ 0.9999999999999999 사이의 값을 만들어줌
document.write(s+"<br>");
var ss = Math.random() * 100; // 0.00 ~ 99.999999
document.write(ss+"<br>");
var sss = parseInt(Math.random() *100); // 0~99
document.write(sss+"<br>");
var ssss = parseInt(Math.random() *100) +1; // 1~100
document.write(ssss);
</script>
math_02.html
<script>
// 주사위 2개를 던진 값의 곱을 출력
var a = parseInt(Math.random()*6) +1;
var b = parseInt(Math.random()*6) +1;
document.write("주사위1 : "+a+"<br>");
document.write("주사위2 : "+b+"<br>");
document.write("곱 : "+a*b+"<br>");
</script>
math_03.html
<script>
// 1-100 사이 랜덤값 생성
// prompt() 이용 값 입력 --> 반복(while 구문, break문 )
// 랜덤값보다 작은지 큰지를 알려준다
// 몇 번만에 맞추는지를 출력
var a = parseInt(Math.random()*100) +1; // 1-100 랜덤값 설정
//document.write("생성된 값은 " + a +"이고,"); // 잘 돌아가는지 확인용
var num=1; //전역변수
while(true) {
var str = parseInt(prompt("숫자를 입력하세요","")); // 입력값
if(a==str) { // 랜덤값 = 입력값이라면
alert("정답입니다.");
break;
} else if(a<str) { // 랜덤값이 작다면
alert("작은 수를 입력하세요");
} else { // 랜덤값이 크다면
alert("큰 수를 입력하세요");
}
num ++;
}
document.write("랜덤값 : " + a + "<br>"+"시도횟수 : " +num);
</script>
math_04.html
<script>
// 로또 만들기 : 1-45 값을 6개 만들자(중복 불가능 처리)
// for 구문 안에 while 구문
// push 이용
// lotto --> 변수명 lt
/* push 설명
var a = new Array(); // var a, var b : 초기화 X 선언만 ㅇㅇ
var b = [];
b[0] = 1;
b.push(45); // index값에 차례대로 밀어넣음 --> [1]에 45 넣음
for(i=0; i<b.length; i++) {
document.write(i+" > " + b[i]+"<br>");
}
*/
/* 시도1
var num= parseInt(Math.random()*45+1);
var a = parseInt(num);
document.write(a);
var lt=[]; // var li = new Array(); "선언"
for(i=0; i<6; i++) {
lt.push(num);
}
document.write(lt);
*/
/* 시도 2
var lt = new Array();
var total =0;
while(true) {
var num= parseInt(Math.random()*45+1);
if(total == 0) { // 중복이 아니라면 그 값 밀어넣기
lt.push(num);
} else{
for(i=0; i<lt.length; i++) {
if(num == lt[i]) {
continue;
}
lt.push(num);
}
}
total++;
if(total == 6) { break; }
}
for(i=0; i<6; i++) {
document.write(lt[i]+"<br>");
}
*/
// 해결
var lt = new Array();
var total =0;
while(true) {
if(total == 0) { // 중복이 아니라면 그 값 밀어넣기
lt.push(parseInt(Math.random()*45+1));
} else if(total<6) { // 2-6번째 공
var result = true; // break 문으로 해도 됨
while(result) {
var num = parseInt(Math.random()*45+1);
var y =0;
for(i=0; i<lt.length; i++) {
if(lt[i] == num) {
y++;
}
}
if(y == 0) {
lt.push(num);
result = false;
}
}
}
total++;
if(total==6) { break; }
}
// 출력구문
for(i=0; i<6; i++) {
document.write(lt[i]+"<br>");
}
</script>로또 참고
'JAVA > html' 카테고리의 다른 글
| 230105_함수, 팝업창, 피라미드, 계산기 (0) | 2023.01.05 |
|---|---|
| 230103_구구단, form (1) | 2023.01.03 |
| 230102_교재, form, 구구단 (0) | 2023.01.02 |
| 221230_JS, 조건문, 반복문, 짝홀 (1) | 2022.12.30 |
| 221229_로또, dance블로그 (0) | 2022.12.29 |
