근혁 study 공부정리

replace() 자바스크립트에서 특정 문자를 찾아 원하는 문자로 바꿀 수 있는 replace() 메서드가 존재한다. 다음은 replace()의 기본형이다 { const str = "자바스크립트(javascript) 공부" text = str.replace("찾는 문자열","변경할 문자열") } str 에서 찾는 문자열을 입력하고 변경할 문자열을 입력한다. 다음은 replace()의 예제이다 { const str = "자바스크립트(javascript) 공부" text = str.replace('공부', '스터디'); //자바스크립트(javascript) 스터디; }

이벤트 버블링(Event Bubbling) 특정 화면 요소에서 이벤트가 발생했을 때 해당 이벤트가 더 상위의 화면 요소들로 전달되어가는 특성을 의미함 상위의 화면 요소? HTML 요소는 기본적으로 트리 구조를 갖는다. 여기서는 트리 구조상으로 한 단계 위에 있는 요소를 상위 요소라고 하며 body 태그를 최상위 요소라고 부른다. { } { var event = document.querySelectorAll("div"); event.forEach(function(div) { div.addEventListener("click", logEvent); }); function logEvent(event){ console.log(event.currentTarget.className) } } 위 코드는 세 개의 di..

slice() slice() 메서드는 배열의 start부터 end 전까지의 복사본을 새로운 배열 객체로 반환한다. 즉 원본 배열은 수정되지 않는다. 기본형 : { slice(start, end) } start :시작점에 대한 인덱스 배열의 길이와 같거나 큰 수를 지정한 경우: 빈 배열을 반환 undefined인 경우: 0부터 slice 함 음수를 지정한 경우: 배열의 끝에서부터의 길이를 나타낸다. slice(-2)를 하면 배열의 마지막 2개의 요소를 추출 end : 종료할 기준 인덱스 배열의 길이와 같거나 큰 수를 지정한 경우: 배열의 끝까지 추출 음수를 지정한 경우: 배열의 끝에서부터의 길이를 나타낸다. slice(2, -1)를 하면 세 번째부터 끝에서 두 번째 요소까지 추출 지정하지 않을 경우: 배열..

setTimeout()란? 일정 시간 후에 특정 코드, 함수를 의도적으로 지연한 뒤 실행하고 싶을 때 사용하는 함수로 사용한다. 자바스클립트 함수 중에서도 특히 자주 사용되는 함수 중 하나이다. 먼저 간단한 문법부터 알아보자. { setTimeout(function(){ //code here }.시간); } 위 함수는 보통 두 개의 인자를 설정할 때 사용 2. 호출될 콜백함수 2. 지연시간(delay time) setTimeout()함수의 내부에 위차한 코드 function(){//Code here}는 콜백 함수로 지연시간 뒤에 실행될 코드를 설정한다. 지연시간은 밀리세컨드 단위로 설정하며 예를 들어 지연시간 1000=1초, 10000 = 10초를 의미한다. setTimeout활용방법 접속 후 몇 초 후..

리턴값 함수 return문은 함수에서 결괏값을 반환할 때 사용합니다. 그리고 함수에서 return문이 실행되면 반복문의 break문과 비슷하게 코드가 강제로 종료된다. 다시 말해 함수 정의문에 return문이 사용되면 함수를 호출했을 때 결괏값(data)을 반환한다. 데이터를 반환하고 강제 종료하는 return문 다음은 return문의 기본형이다. 기본형 { function 함수명(){ 자바스크립트 코드1;

함수 데이터를 저장할 때 변수를 선언하여 저장하였습니다. 변수에는 데이터만 저장할 수 있고, 코드는 저장할 수 없다. 하지만 함수를 사용하면 코드를 메모리에 저장했다가 필요할 때마다 호출하여 사용할 수 있다 선언적 함수 함수를 사용하여 코드를 저장한 것을 '함수 정의문'이라고 한다. 변수를 선언할 때 var 키워드를 사용한 것처럼 함수에서 function 키워드를 사용해 변수를 선언한다. 함수 정의문은 다음과 같이 선언한다. 기본형 : { function 함수명(){ 자바스크립트 코드; } 함수 정의문({...}) 안에 작성된 코드는 즉시 실행되지 않는다 함수는 메모리에 할당되어 대기하고 있다가 함수가 호출되면 실행합니다. 정의되어 있는 함수를 호출하는 기본형은 다음과 같다. { 기본형 : 함수명 = (..

연산자 연산자란 수학 시간에 연산을 할 때도 마찬가지였지만, 컴퓨터를 이용해서 코드를 통해 연산을 할 때도 연산의 방식을 결정하는 기호를 '연산자'라고 부르고 연산되는 대상을 '피연산자'라고 한다. 우리에게 가장 익숙한 +,-,*,/이 가장 대표적인 예이다. 산술 연산자 산술연산자는 산수 시간에 배운 더하기(+), 빼기(-), 나누기(/), 나머지(%)가 있다. 산술 연산자로 연산을 하기 위해서는 연산 대상 데이터가 반드시 2개 있어야 한다. 다음은 산술 연산자의 종류와 기본형을 정리한 표이다. 종류 기본형 설명 + A + B 더하기 - A - B 빼기 * A * B 곱하기 / A / B 나누기 % A % B 나머지 다음 예제를 통해 더하기,빼기,곱하기,나누기,나머지 연산자를 어떻게 사용하는지 확인하자...

break문, continue문 자바스크립트에서 중간에 반복문의 소스를 중단하고 빠져나오는 break문과 마지막까지 실행하지 않고 건너뛰어서 반복을 실행하는 continue문이있다 break문 반복문인 while문 또는 for문에서 break문을 실행하면 조건식과 상관없이 강제로 반복문을 종료한다. 즉 break문은 반복문을 강제로 종료할 때 사용한다. 다음은 break문의 기본형이다 { for(초깃값;조건식;증감식){ break; //반복문을 강제로 종료합니다. 자바스크립트 코드; } } { for(초깃값;조건식;증감식){ break; //반복문을 강제로 종료합니다. 자바스크립트 코드; } } { var 변수 = 초깃값; while(조건식){ break; //반복문을 강제로 종료합니다. 자바스크립트 코..