
[JS] 단락회로 평가
2022. 6. 28. 17:49
개발이야기/JS
단락회로 평가란? 논리연산자의 특성을 이용한 문법이다. 논리연산자를 다시 정리해보자. console.log(true && true); console.log(true || false); console.log(!true); 단락회로 평가는 왼쪽에서 오른쪽으로 연산하게 되는 논리연산자의 연산 순서를 이용하는 문법이다. console.log(false && true); && 연산자에서 앞에 값이 false면 두번째 피연산자는 볼 필요가 없다. (둘다 true가 되야하기때문) 이렇게 피연산자 중에 뒤에 위치한 피연산자는 볼 필요없이 연산을 끝내버리는것을 단락회로 평가라고 한다. console.log(true || false); or 연산자는 어떨까? or 연산가의 경우에는 둘중에 하나만 true 여도 true를 ..

[JS] 삼항연산자
2022. 6. 28. 16:54
개발이야기/JS
삼항연산자의 기본적인 사용방법 삼항연산자를 만들기 앞서 간단하게 조건식을 만들어보자. let a = 3; if (a >= 0) { console.log('양수') } else { console.log('음수') } a가 0보다 크거나 같으면 양수, 아니면 음수! 이렇게 적어줘도 되지만 더 간단하게 표현 할 수 있는 방법이있다. let a = 3; a >= 0 ? console.log('양수') : console.log('음수'); a가 0보다 크면 양수, 아니면 음수를 출력해라. 라는 뜻이다. 이렇게 삼항연산자는 조건문을 파격적으로 줄여줄수있는 태크닉이다. 우선, 조건식을 적어주고 물음표 키워드를 사용한다. 그 다음엔 참일때 ,실행한 식을 적고, 거짓일때 실행할 식은 : 콜론을 찍고 적어주면 된다. le..

[JS] 배열
2022. 6. 28. 00:28
개발이야기/JS
배열 생성 배열도 여러개의 데이터가 들어가는 비원시 타입이다. let arr = [1, "2", true, null, undefined, {}, [], function () {}]; 배열은 자료형이 다 달라도 다 넣을 수 있다. 배열의 접근 방법 = index let arr = [1, 2, 3, 4, 5] console.log(arr[0]); 0부터 시작하는 순서로 배열에 접근할 수 있다. 배열에 index 추가 방법 let arr = [1, 2, 3, 4, 5] arr.push(6); console.log(arr[0]); 6이라는 숫자를 push 메소드를 사용하면 배열의 마지막에 뭐든 추가 할 수 있다. arr.push({key: "value"}); //이렇게도 추가가능 배열의 길이를 변수로 받아오는 ..

[JS] 객체
2022. 6. 28. 00:13
개발이야기/JS
객체생성 방법 비 원시 타입의 객체를 알아보자. 객체를 생성할땐 두가지 방법이있다. 1) let person = new Object(); 2) let person = {}; new 키워드를 통해서 만드는것은 생성자 방식, 중괄호를 통해서 생성하는것을 객체 리터럴 방식이라 한다. (중요하진않음) 객체 리터럴 방식이 만들기 편하기때문에 많은 사람들이 리터럴방식으로 사용한다. 객체는 여러가지 데이터를 동시에 가질 수 있는 비 원시 타입이다. 간단한 규칙만 지켜주면되는데 왼쪽엔 key : 오른쪽엔 value 키밸류 형식으로 만들어야하고 이 키:밸류를 프로퍼티(객체 프로퍼티)라고 한다. 객체 프로퍼티 접근 방법 let person = { key: "value", key1: 123, key2: true, key3:..

[React] 하위 Route 만들기
2022. 6. 23. 15:03
개발이야기/React.js
path가 길어지고 복잡해지면 하나의 Routes 안에서 다루기가 복잡해진다. 그래서 리액터 라우터안에서는 라우터를 중첩해서 사용할 수 있게 해준다. 이렇게 Route로 같은 path를 가지고있는 컴포넌트끼리 (route로) 감싸준다. path프롭으로 path="qustions"을 지정해준고, 안에있는 라우터들은 qustions을 지워준다. 이때 index에 해당하는 라우트에는 index값을 지정해주면 된다. 👇🏻