개발/JavaScript

특정 위치로 스크롤

//영역뷰로 스크롤 document.querySelector('class Or Id').scrollIntoView({ behavior: 'smooth', block: 'start / center / end' )} //영역 맨위로 스크롤 window.scroll({ behavior: 'smooth', left: 0, top: document.querySelector('class Or Id').offsetTop })

자바스크립트(Javascript) 순서도를 그리는 이유

프로그래밍에서는 절차가 매우 중요합니다. 코드를 에디터에 입력하기 전에 내가 만들 프로그램이 어떤 절차로 돌아갈지 미리 생각해야 합니다. 예를 들어 끝말잇기가 어떤 식으로 진행되는지 말로 설명을 해봤습니다. 최대한 구체적으로 순서를 말할 수 있으면 더 좋습니다. 1. 세 명의 참가자가 있습니다(여기서는 A, B ,C라는 사람이 있다고 가정). 2. A가 '자바스크립트'라고 말했습니다. 3. B가 '트집'이라고 말했습니다. 4. C가 '집합'이라고 말했습니다. 5. 다시 A가 '합체'라고 말했습니다. 6. B가 ... 7. 무한반복 다시 참가를 4명으로 늘려봅시다. 1. 네 명의 참가자가 있습니다(여기서는 A, B ,C, D라는 사람이 있다고 가정). 2. A가 '자바스크립트'라고 말했습니다. 3. B가 ..

자바스크립트(Javascript) 객체의 비교(원시값과의 차이점)

객체 간의 비교 객체를 다룰 때 가장 많이 실수하는 상황은 객체 간에 비교 연산을 할 때입니다. {} === {} //실행결과 false 객체가 아닌 숫자, 문자열, 불 값, null, undefined는 모두 true를 반환합니다. 'str' === 'str' 123 === 123; false === false; null === null; undefined === undefined; //실행결과 모두 true 객체는 모양이 같아도 생성할 때마다 새로운 객체가 생성됩니다. 따라서 같은 객체인지 비교하고 싶다면 기존 객체를 변수에 저장해 두어야 합니다. const a = { name: '홍길동' }; const array = [1, 2, a]; console.log(a === array[2]); //실행결..

자바스크립트(Javascript) 객체 리터럴 기본

배열과 함수는 객체입니다. 여기서 배열과 함수가 아닌 것들을 중에서 특정 모양을 가지면 객체 리터럴이라고 부릅니다. 객체 리터럴에는 속성의 이름과 속성의 값들이 있습니다. const name = '홍길동'; const year = 2000; const month = 1; const date = 10; const gender = 'M'; //객체리터럴을 사용시 const info = { name: '홍길동', year: 2000, month: 1, date = 10, gender: 'M', }; //객체리터럴 사용법 console.log(info.name); console.log(info['name']); console.log(info.date); console.log(info['date']); 객체리터럴..

자바스크립트(Javascript) 매개변수(Parameter)와 인수(Argument)

function a(parameter) { console.log(paramerter); } a('argument'); //실행결과는 argument 함수를 선언 할 때는 parameter(매개변수), 함수를 호출 할 때는 argument(인수) parameter = 'argument'; ex 1) function a(w, x, y, z) { console.log(w, x, y, z); console.log(arguments); } a('Hello', 'Parameter', 'Argument'); //실행결과 Hello Parameter Argument undefined Arguments(3) ['Hello', 'Parameter', 'Argument'] ex 2) function add(x, y){ re..

자바스크립트(Javascript) 함수(function) 기본

프로그래밍에서 함수(function)는 일정한 동작을 수행하는 코드를 의미합니다. 함수를 만들 때 보통 function 예약어를 사용하거나 =>(화살표) 기호를 사용합니다. 화살표 기호를 사용한 함수를 화살표 함수(arrow function)라고 합니다. function() {} 또는 () => {} function a() {} //함수 선언문(function declarartion statement) const b = function() {}; //함수 표현식(function expression) const c = () => {}; //화살표 함수(arrow function) 만든 함수를 사용하는법(호출하는법 call) 함수 a를 선언한 후 a뒤에 ()를 붙이면 함수가 실행됩니다. function a(..

자바스크립트(Javascript) 배열에서 삭제하고 싶은 요소만 삭제하는법

const array = [가, 나, 가, 라, 마, 바,가]; 이 배열에서 '가' 만 삭제하고 싶으면 while, indexOf, splice를 사용해서 삭제할 수 있습니다. while(array.indexOf('가') != -1){ array.splice(array.indexOf('가'), 1) }