본문 바로가기

분류 전체보기77

JavaScript - 텍스트 문자열의 연결 1. 텍스트 + 텍스트 조합 텍스트를 서로 조합할 수 있다. 조합할 때는 + 연산자를 사용한다. 텍스트와 변수를 조합해서 사용할 수도 있다. console.log("안녕" + "하세요"); console.log("안녕" + "하" + "세요"); console.log("안녕" + "하세" + "" + "요"); let hi = "안녕"; console.log(hi + "하세요"); let ha = "하세요"; console.log(hi + ha); 위 코드는 모두 같은 결과가 나온다. 2. 텍스트 + 숫자 조합 텍스트인 String과 숫자인 Number의 조합이다. console.log("2" + "2"); 이렇게 쓸 경우 결과는 22라는 문자열이 출력된다. 그 이유는 ""(쌍따옴표)로 감싸져 있기 때문.. 2020. 6. 21.
JavaScript - Math expressions JavaScript 코드에 숫자를 사용해 수학계산을 할 수 있다. let a = 1.3; let b = 2; let c = -10; console.log(a+b); console.log(b*c/10); console.log(a+10); console.log(450-30); console.log(a+10*b*b/2+3); 위 코드처럼 수학계산을 할 수도 있지만, 컴퓨터 언어가 사용하는 수학 표현식은 아래처럼 표현할 수 있다. let num = 1; num++; 여기서 num++; 은 num = num + 1;과 같은 표현이다. 반대로 num--; 은 num = num - 1;과 같은 표현이다. 이렇게 훨씬 간략한 코드로 구현할 수 있다. let num = 1; let newNum = num++; conso.. 2020. 6. 21.
JavaScript - Function(함수) 1. 함수의 정의 함수란 하나의 특별한 목적의 작업을 수행하도록 설계된 독립적인 블록이다. 변수도 이름이 있듯이, 함수도 이름이 있다. 함수 이름을 부르면, 함수 내에 있는 코드가 실행된다. 함수 이름을 부르는 것을 "함수를 호출한다."라고 표현한다. function test() { let hi = "안녕하세요"; return hi; } 함수 이름이 test이다. 위와 같이 함수를 생성하고 이름을 불러 호출할 수 있다. test(); 이름을 쓰고 이름 뒤에 ();를 해주면 호출된다. 2. 함수의 형태 함수의 형태는 그림과 같다. 함수를 선언할 때는 함수 이름을 지어주고, 함수를 알리는 괄호()를 열고 닫고, 함수의 시작을 알리는 중괄호를 열어준다. 그리고 실행할 코드를 작성한다. 함수의 body라고 부르.. 2020. 6. 21.
React - JSX 1. JSX란? JSX는 리액트에서 사용하는 자바스크립트 확장 문법이다. JSX로 작성한 코드는 브라우저에서 동작하는 과정에서 바벨(Babel)을 사용하여 일반 자바스크립트 형태의 코드로 변환된다. JSX는 많은 개발자에게 친숙한 구문을 사용하여, 요소(구성요소)의 렌더링 구조를 지정하는 방법을 제공한다. JSX 장점 - HTML 태그를 사용하기 때문에 보기 쉽다. - HTML 태그를 사용하면서 자바스크립트도 {}를 사용해 JSX 안에서 동작하게 할 수 있다. 2. JSX - Fragment react에서 컴포넌트를 나누어 개발을 할 때 불필요하게 div를 감싸고 내부부터 태그를 삽입하다 보면 불필요하게 DOM구조가 복잡해진다고 느낄 때가 있다. 이것을 Fragment를 통해서 불필요한 div 렌더링을 .. 2020. 6. 20.