javascript 12

[코드캠프] 함수, 내장함수

함수function 함수이름(매개변수){      함수를 호출했을 때 실행할 명령문 } 함수선언식 function hello(name){   alert(name+"님 안녕하세요")} 함수표현식const hello = function(name){  alert(name+"님 안녕하세요")} 화살표 함수const hello = (name) =>{  alert(name+"님 안녕하세요")}  내장함수자주 사용되는 함수를 자바스크립트에 내장하여 편리하게 이용할 수 있도록 한 것시간 지연 함수 : setTimeout(func, time) // 시간 입력 시 ms 단위로 입력시간 반복 함수: setInterval(func, time)  * 위 사진처럼 인증완료 버튼을 비활성화 하는 방법은html에서 인증완료라는..

javascript 2025.03.03

[코드캠프] 싸이월드 4,5탄

nav 속성을 이용하여 현재 이용하고 있는 페이지를 나타낼 수 있도록 하였다.또한 HTML의 속성 중 하나인 iframe을 사용하여 각 페이지 별로 다른 페이지를 나타낼 수 있도록 웹 페이지 안에 또다른 웹페이지를 삽입하였다. 그동안은 iframe을 유튜브 영상을 집어넣는 용도 정도로만 사용하였지만, 이렇게 또다른 HTML파일을 집어 넣어 각 파일들을 연결시킬 수 있음을 알 수 있었다. 기술을 구현해내는데에는 큰 어려움이 없었지만 코딩을 하기 전에 각 구역을 나눌 때 어려움이 많았다.내 생각보다 작은 단위로 나누어 div class를 선언하였고, 자세히 나눌 수록 크기를 맞추거나 디자인하기 편하다는 것도 느낄 수 있었다.

javascript 2025.03.03

[코드캠프] 싸이월드 만들기 2탄, 3탄

싸이월드 만들기 2탄글씨체를 지원해주지 않아서 그 부분을 구현하지 못했고, 이 부분을 제외하고는 수월하게 구현해낼 수 있었다. 왼쪽과 오른쪽 상자의 높이가 맞지 않는 일이 발생했었는데 wrapper_left_header를 div로 묶을 때 뒷 태그의 위치가 잘못되어 길이가 다르게 나타난 것이었다. 다른 걸 모두 구현하고 나서 다시 한번 흝어보니 다행히 쉽게 찾을 수 있어 수정하였다.  싸이월드 만들기 3탄 끝말잇기 게임을 구현할 때 함수를 사용했는데 나는 평소에 화살표함수를 잘 사용하지 않아 어색했다. const startWord = () => { let myword = document.getElementById("myword").value let word= document.getElement..

javascript 2025.03.01

[코드캠프] 조건문 & 반복문& 수학객체

조건문 컴퓨터가 조건에 맞는지 true, false로 판단하여 판단을 기반으로 각각 다른 명령을 실행할 수 있도록 하는 것비교 연산자와 함께 쓰인다 if(조건1){  A 실행} else if(조건2){  B 실행}else if (조건3){  C 실행} else {  D 실행} => 조건1이 맞다면 A실행아니면 조건 2가 맞다면 B실행아니면 조건 3가 맞다면 C실행모두 아니면 D실행  반복문for(초기식; 조건식; 증감문) {반복해서 실행할 내용}변수명은 자유롭게 설정 가능 조건식을 이용해서 종료(break), 건너뛰기(continue) 가능요소가 몇 개 들어있는지 모르는 경우 조건식 부분에 숫자를 직접 입력하는 것이 아니라 000.length로 작성 가능 수학객체최대값 구하기 : Math.max(3,5,..

javascript 2025.02.27

[코드캠프] 변수와 상수 & 배열 & 객체

변수와 상수선언은 let var const 로 가능하다 let name = "철수" 위의 경우에 = 는  같다는 의미가 아니라 변수에 데이터를 대입한다는 뜻이다  var letconst이름 중복oxx데이터 수정(재할당)oox 변수는 let으로 , 상수는 const를 주로 사용하여 선언한다 변수 이름은 항상 소문자로 시작하고 중간중간에 대문자를 사용하여 가독성을 높인다    let nameconsole.log(name) 선언만 하고 값을 할당하지 않은 경우 undefined를 출력한다.  const name = "홍길동"name= "장발장"console.log(name) const는 재선언 재할당 모두 불가하므로 위와 같이 작성할 경우Uncaught TypeError: Assignment to consta..

javascript 2025.02.05

프로그래밍과 데이터 (3) 자료형 심화

지수표기법 : 알파벳 e를 이용하여 숫자를 나타내는 방법이다.알파벳 왼쪽에 있는 수에 오른쪽에 있는 수만큼 10의 거듭제곱을 곱하는 의미이다.오른쪽에 있는 수가 음수라면 10의 거듭제곱만큼 나누라는 의미이다. 16진법 : 0x--8진법 : 0o--2진법 : 0b-- 으로 표기할 수 있다.  toFixed(): 소수를 다룰 때 사용하는 메소드이다.파라미터로 숫자를 전달하면 그 숫자만틈 소수점 아래의 자릿수를 고정해준다.이때 계산된 값은 문자열이다.Number함수를 사용하여 숫자로 변환할 수도 있고, +기호를 사용하면 쉽게 숫자형으로 변환가능하다. ()toString(): 파라미터로 전달되는 숫자의 진법으로 숫자를 변환해주는 메소드이다.숫자에 바로 이 메소드를 사용할 수 있는데 이때는 점을 두 개(..) 찍..

javascript 2024.08.29

프로그래밍과 데이터 (2) 배열

배열(array)대괄호를 이용하여 나열한다.배열의 요소들의 순서는 숫자로 매겨지며 이는 인덱스라고 부른다.  let numbers =[1, 3, 5, 7]; 인덱싱배열이름[index]를 통해 요소에 접근할 수 있다.이때 인덱스는 0부터 시작한다.  배열 안에 들어있는 데이터의 개수를 알기 위해서는numbers.length프로퍼티를 사용하면 되고, numbers['length']처럼 대괄호를 사용하여 표현할 수도 있다.   배열의 메소드splice(): 배열의 요소를 삭제할 때 사용하는 메소드 (delete메소드는 완벽하게 삭제되지 않음)splice(startIndex)입력된 파라미터의 값=전달된 인덱스 로부터 그 이후에 있는 모든 요소를 삭제시킨다.=> 숫자를 두 개 입력하여 해결splice(startI..

javascript 2024.08.28

프로그래밍과 데이터 (1) 객체

객체(object)중괄호를 통해 만들 수 있으며 다양한 값들은 쉼표를 사용하여 구분한다.값들은 콜론과 함께 이름을 붙여 사용한다. ex)let fruit= { apple: "red", banana: "yellow", kiwi: "green"} ;이때 red, yellow, green은 value 값이고, apple, banana, kiwi는 key 값이며key와 value 한 쌍을 속성이라고 부른다. key 이름을 지을 때는 1. 첫 번째 글자는 반드시 문자, 언더바(_), 달러($)중 하나로 시작해야한다.2. 띄어쓰기와 하이픈(-)은 사용하지 못한다.3. ""로 묶어주면 위와 상관없이 사용 가능하다. value는 모든 자료형 값을 사용할 수 있으며 값 안에 또 다른 객체를 넣을 수 있다.  점표기법 (..

javascript 2024.08.23

javascript 프로그래밍 핵심 개념 (3) 제어문

if문if(조건부분){   동작부분}조건 부분이 충족되면 동작 부분을 수행하는 구문if/ else if switch 문switch(비교할 값){ case 조건값1:     동작부분;      break;  case 조건값2:     동작부분;      break;  default:     동작부분;} for 반복문for (초기화부분; 조건부분; 추가동작부분){  동작부분;}초기화 부분에서 생성한 변수는 for문의 로컬변수이다. for문 안에서 생성하였기 때문에 for 반복문이 끝나고 나서 for문 밖에서 변수를 사용할 수 없다. 자바스크립트에서 console.log는 출력후 자동으로 줄바꿈을 추가한다. 한 반복문이 끝난 후 줄바꿈 없이 출력하기 위해서는 console.log 대신 process.stdou..

javascript 2024.08.22

javascript 프로그래밍 핵심 개념 (2) 추상화

할당 연산자ex) x=x+2오른쪽에 있는 피연산자를 왼쪽에 있는 피연산자에 할당한다. 복합 할당 연산자x=x+1와 x+=1 은 같다.x=x-1와 x-=1 은 같다.x=x*1와 x*=1 은 같다.x=x/1와 x/=1 은 같다.x=x%1와 x%=1 은 같다. 증가 감소 연산자x=x+1와 x+=1, x++은 같다.x=x-1와 x-=1, x--은 같다.  함수* 함수의 변수가 문자열일 때 함수를 작성하고 싶다면 function logParticipant(x){  console.log(x+"(이)가 대화에 참여했습니다.");} 처럼 함수 매개변수 선언 부분에서 타입을 지정할 필요가 없다.   return문어떤 값을 되돌려주는 아웃풋의 역할을 한다리턴문을 통해서 함수 호출 부분에 어떤 값을 되돌려주고 나면 그대로 ..

javascript 2024.08.17