조건문을 작성할 때, 논리 연산자를 자주 사용하게 된다. 논리 연산자에 따라 주어진 조건의 결과가 true인지 false인지 정해진다. 이러한 논리 연산자의 관계는 진리표를 사용하면 이해하기 쉽다. 목차 진리표란? || (OR) 연산자의 관계 && (AND) 연산자의 관계 1. 진리표란? 진리표(True table)란, 모든 명제나 그 조합에 대한 결과를 정리해놓은 표이다. 논리학에서 사용되는 것인데 자바스크립트 코드를 작성할 때에도 유용하게 사용된다. ∨(또는) 진리표 A B A ∨ B (A 또는 B) true true true true false true false true true false false false A와 B 두 개의 명제 중 하나라도 true이면, 결과도 true이다. 반대로 말해서 ..
일반적으로 함수를 만들 때에는 function 예약어를 사용한다. 일반적인 함수 표현식보다 더 간결하게 표현할 수 있는 방법이 있는데 바로 화살표 함수(arrow function)를 사용하는 것이다. 이 함수의 형태가 화살표처럼 생겨 화살표 함수라는 이름이 지어졌다. 목차 함수의 선언 함수의 호출 함수의 매개변수와 인수 1. 함수의 선언 함수를 다른 곳에서 사용하기 위해서는 이름을 붙여주어야 한다. 일반적으로 사용하는 함수의 형태는 function 뒤에 함수 이름을 바로 적는 데, 이를 함수 선언문(function declaration statement)라고 한다. 이와 다르게 변수나 상수에 대입하는 형식을 함수 표현식(function expression)이라고 한다. 아래 여러 가지 기본 형태를 외워두..
원하는 요소에 접근하기 위해서는 상대 위치, 절대 위치를 사용하면 된다. 요소가 서로 가까운 경우에 상대 위치를 사용하면 되고, 상대 위치를 이용하지 않으면서 원하는 목표 요소에 접근하기 위해서는 절대 위치를 검색하는 방법을 통해 접근할 수 있다. 목차 getElementById(), id 사용하여 검색 querySelectorAll() querySelector() 1. getElementById(), id 사용하여 검색 형식 document.getElementById(selectors); 타이틀입니다. 텍스트입니다. 단, id를 직접 참조하는 경우, 같은 이름의 변수가 선언되면 참조가 불가해진다. 따라서 와 처럼 id를 직접적으로 사용하는 코드는 변수와 충돌할 위험이 있으므로 지양하여야 한다. 타이틀입..
여러 가지 변수를 하나의 묶음으로 나타낼 때 객체를 사용한다. 이러한 객체를 표현할 때, 중괄호 {}를 사용하여 나타내는 방식이 바로 객체 리터럴이다. 객체 리터럴의 형태와 속성 값에 접근하는 방법을 알아보자. 목차 객체 리터럴 형식 객체 속성 접근 객체 속성 수정 객체 속성 제거 객체 참조 1. 객체 리터럴 형식 객체 리터럴 형식에서 속성이 여러 개일 경우 쉼표로 구분해준다. const info = { name : '김영희', age : 28, } 객체 이름 속성 이름 속성 값 info name, age 김영희, 28 2. 객체 속성 접근 객체 리터럴 형식에서는 객체 이름을 통해 속성에 접근할 수 있다. 온점으로 접근하는 방식과 배열처럼 접근하는 방식 두 가지가 있다. const info = { nam..
자바스크립트 함수에서 함수명 소괄호에 들어가는 문자가 어떤 역할을 하는지 궁금할 것이다. 매개변수(parameter)와 인수(argument)에 대해서 알아보자. 목차 매개변수와 인수의 형태 매개변수과 인수의 개수 1. 매개변수와 인수의 형태 function a(parameter) { console.log(parameter); } a('argument'); // 함수 호출 // 결과 : argument 함수명 a 옆에 있는 소괄호의 안에 들어있는 'parameter'는 매개변수이다. 고정된 값이 아닌 말 그대로 변수이다. 따라서 넣어주는 값에 따라 달라지는데, 이때 인수를 사용한다. a라는 함수를 호출하면서 소괄호에 'argument'라는 문자열을 넣어주었다. parameter 매개변수에 'argumen..
[Javascript] 배열 요소 찾아서 제거 / includes, indexOf, lastIndexOf 기능
배열에서 원하는 요소를 찾아 삭제해야 하는 경우가 있다. 우선 배열에서 특정 요소를 찾는 방법을 알아보고 그 요소만 골라서 삭제하는 방법에 대해 알아보자. splice 기능에 대해 아직 모른다면 먼저 아래 페이지를 참고하여 공부하고 오길 바란다. [Javascript] splice 기능 - 배열에서 원하는 요소 제거, 추가 자바스크립트에서 배열의 맨 앞과 맨 뒤 요소를 제거하거나 추가하는 방법은 비교적 간단했다. 그렇다면 원하는 위치의 요소를 제거하거나 다른 값으로 바꾸기 위해서는 어떤 기능을 사용해야 fromnowwon.tistory.com 목차 includes indexOf, lastIndexOf 배열에서 원하는 요소를 찾아 제거하는 방법 1. includes includes는 특정 요소가 배열 안에..
자바스크립트에서 배열의 맨 앞과 맨 뒤 요소를 제거하거나 추가하는 방법은 비교적 간단했다. 그렇다면 원하는 위치의 요소를 제거하거나 다른 값으로 바꾸기 위해서는 어떤 기능을 사용해야 할까? 목차 배열에서 원하는 요소 제거하기 배열에서 요소 제거 후 다른 값 넣기 1. 배열에서 원하는 요소 제거하기 맨 앞과 맨 뒤 요소가 아닌 중간에 있는 요소를 제거하기 위해서는 splice 기능을 사용하면 된다. splice의 첫 번째 숫자는 인덱스이고 두 번째 숫자는 해당 인덱스의 요소를 포함하여 제거할 요소의 개수를 나타낸다. const array = ['a', 'b', 'c', 'd']; array.splice(1, 1); // 인덱스 1인 요소를 포함하여 1개 요소 삭제 console.log(array); // ..
자바스크립트에서는 배열의 맨 앞과 맨 뒤 요소를 추가하거나 제거하기 위해 여러 가지 기능을 제공하고 있다. 배열의 맨 앞과 맨 뒤의 요소를 제거하기 위한 기능은 어떤 게 있는지 알아보자. 목차 배열의 맨 뒤 요소 제거 배열의 맨 앞 요소 제거 1. 배열의 맨 뒤 요소 제거 배열의 마지막에 새로운 요소를 추가할 때에는 length를 활용하는 방법이나 push 기능을 사용하면 된다. 반대로 맨 뒤 마지막 요소를 제거할 때에는 pop 기능을 사용하면 된다. const array = ['a', 'b', 'c', 'd']; array.pop(); console.log(array); // 결과 : ["a", "b", "c"] 2. 배열의 맨 앞 요소 제거 배열의 맨 앞에 요소를 추가할 때에는 unshift라는 기능..
자바스크립트의 배열은 요소를 추가할 수도 있고, 수정이나 제거할 수도 있다. 요소 수정의 경우 요소의 인덱스를 활용하여 쉽게 변경할 수 있다. 그렇다면 배열의 맨 뒤와 맨 앞에 요소를 추가하기 위해서는 어떻게 해야 할까? 목차 배열의 맨 뒤에 요소 추가하기 배열의 맨 앞에 요소 추가하기 1. 배열의 맨 뒤에 요소 추가하기 배열의 인덱스는 0부터 시작하기 때문에, 맨 뒤 요소의 인덱스는 항상 배열의 개수보다 1만큼 적다. 이 점을 활용하여 맨 뒤에 요소를 추가할 수 있다. const array1 = ['a', 'b', 'c', 'd'] // 맨 뒤 요소인 'd'의 인덱스는 3, 전체 요소의 갯수(array1.length)는 4 array1[array1.length] = 'e' // 기존 배열에 없는 4번째..