그날의 공부기록

seokachu's Front-End Archive 🙂

🐶 etc/2022기록

String (문자열과 관련되어 있는 함수) charAt 인덱스번호에 해당하는 문자열 출력(공백도 포함) let str = 'hello world'; document.write(str.charAt(4)); //답 o IndexOf, Search(같은 내용) let str = 'hello world'; document.write(str.indexOf('world')); //출력 : 6 document.write(str.search('world')); //출력 : 6 찾고자하는 문자열이 몇번째에 있는지 찾아줌. 만약에 찾는 문자열이 없으면 -1로 출력 → 주소표시줄에서 실무에서 많이 사용함 concat → 문자열을 합침 let str = 'hello world' let str2 = 'welcome unive..

2023. 6. 27.

🐶 etc/2022기록

let i = 0; document.write(i+' '); i += 2; document.write(i+' '); i += 2; document.write(i+' '); i += 2; 2/4/6 let i = 0; document.write(i+' '); i += 2; document.write(i+' '); i += 2; document.write(i+' '); i += 2; for(초기문; 조건문; 증감문){ //반복할 구문 } 초기문 : 초기값을 설정한다 조건문 : 언제까지 반복할지 조건문을 설정한다 증감문 : 반복문을 수행하고 초기값을 늘리거나 줄이는 문장을 설정한다. for(let i = 0; i

2023. 6. 27.

🐶 etc/2022기록

if조건문 if(조건){ 참일 때 할일 }else{ 거짓일 때 할일 } 1과 1은 같기 때문에 두 값은 같다라고 출력됨. 1과 1은 같기 때문에 두 값은 다르다고 출력됨. 타입이 다름 //typeof(값) 타입 확인 하는법 string, number, object 중첩 조건문 → 조건문 안에 조건문 조건문의 축약 중괄호 생략가능 & if, else 생략 if,else생략은 else까지 모두 기술해야한다. 논리연산자 switch switch(조건){ case 1: 할일; case 2: 할일; case 3: 할일 break; } let number = prompt('숫자를 입력해주세요','0'); console.log(number); switch(number % 2){ case 0: alert('짝수'); ..

2023. 6. 26.

🐶 etc/2022기록

객체는 변수와 함수가 모여 만든 하나의 꾸러미로서 함수 보다 좀더 복잡하고 정교한 데이터들을 하나의 객체 안에 담아서 활용할 수 있게 된다. 문법 : 새 객체(빈 객체) let s1 = {}; //빈 객체 s1.kor = 100; //변수 kor 값 100저장 s1.eng = 80; s1.math = 100; document.write(s1.math); let s1 = { kor : 100, eng : 80, math : 100, total : function(){ let sum = this.kor + this.eng + this.math; return sum; } }; let s2 = { kor : 100, eng : 80, math : 100 }; document.write(s1.total()); 배..

2023. 6. 26.

🐶 etc/2022기록

함수의 구조 → 입력,할일,출력 function send(){ alert('경고'); } //함수를 실행 : 함수명(); send(); 지역변수, sum을 밖에서 불러와서 오류가 남 //지역변수일때는 결과를 반드시 return을 해줘야 출력됨. function add(a,b){ let sum = a+b; //할일 return sum; //출력 } let result = add(10,30); //document.write(result); document.write(sum); 전역변수 → return은 지역변수일때만 사용★★★★★★★★ let sum; function add(a,b){ sum = a+b; //할일 return sum; //출력 } let result = add(10,30); //documen..

2023. 6. 26.

🐶 etc/2022기록

변수 → 변함, 변할 수 있음. var 변수 선언, 값 초기화 let (ES6 버전 생성) const(상수, ES6버전) 상수 = 절대 변하지 않을 값 var _new= "기본"; //선언,초기화 _new = '기초'; //새로운 값을 저장(할당), 변경 var 어디서든 값을 할당,사용 let → 범위내에서 사용 { 중괄호 안에서 사용 } 변수타입 구분 기본타입 참조타입 정의 원시 데이터로 더 이상 단순화 할 수 없는 값 데이터 및 정보의 가장 단순한 형태 다른 여러 값으로 구성된 복합 값 종류 숫자,문자열,불리언,null,undefined 배열, 함수, 정규표현식 함수는 입력→ 할일 → 출력순 함수의 구조 //입력,할일 function sendMsg(msg){ //msg parameter 매개변수,입력..

2023. 6. 26.

🐶 etc/2022기록

DOM Document Object Model의 약어로 DOM이라고도 함 문서에 접근하기 위한 표준으로 W3C 에서 정의 HTML DOM은 HTML구성요소들을 휙득,변경,추가,삭제하기 위한 표준 HTML문서를 브라우저에도 로드 시 각 구성요소들을 객체화하여 객체 트리 구조를 나타냄. HTML문서 객체 모델 트리구조로 되어있음. 요소는 노드라고 부름. 요소노드 : html 요소 텍스트 노드 : 요소 노드안에 있는 글자 노드 : 객체화된 각 요소들 button에 바로 script 삽입하기 이름 script로드시 1. 헤더안에 defer삽입 2. DOMContentLoaded 넣기 //이벤트 적용 document.addEventListener('DOMContentLoaded',function(){ docume..

2023. 6. 22.

🐶 etc/2022기록

var 변수이름 = 값 선언한다. 변수이름. 변수이름에 값을 담는다. 전역변수, 지역변수, 매개변수 등 여러가지 변수의 종류가 있다. 변수의 문법 var name = "홍길동"; var number = 10; var human = false; 변수에 저장할 수 있는 값 숫자 문자 Boolean (true/false) 함수 (작업을 수행하거나 값을 계산하는 문장을 집합함) 배열 (비슷한 성격의 값들을 하나의 변수에 저장) undefined (변수를 선언만 하고 값을 할당하지 않음) null (변수를 선언하고, null이라는 빈 값을 할당한 경우) 변수 → 기본타입 : 변수에 할당된 값이 실제로 변수가 가지고 있는 형태 → 참조타입 : 값을 포함하고 있는 형태 연산자 → 값을 계산하거나 증가,감소,문자열을 ..

2023. 6. 19.

🐶 etc/2022기록

주석명은 간결하고 정확하게 적어주는게 좋다. /** */ 점찍을때 자동완성. 부가정보 전부 넣을 수 있어서 좋음. 명시 가능

2023. 4. 17.

🐶 etc/2022기록

setTimeout 딱 한번만 시간을 재고 싶을때 setTimeout을 사용한다. 구문 setTimeout(시간되면 할일, 측정할 시간) 예시 setTimeout(function(){ alert("HELLO "); },3000); 3초후 1번만 알럿창으로 HELLO를 출력한다. 타이머 setInterval(할일,시간) clearInterval(인터벌이름) 예시 setInterval(function(){ alert("HELLO");},3000); 3초마다 반복해서 alert창을 띄운다. setTimeout()과 clearTimeout() setTimeout()함수는 매개변수 delay에 설정한 시간 뒤에 매개변수 callback 함수를 한번 호출한다. 이때 setTimeout()함수의 고유 index번호를..

2023. 3. 30.