본문 바로가기

JavaScript8

자바스크립트, 호이스팅(Hoisting) 호이스팅(Hoisting) 호이스팅은 코드에 선언된 변수 및 함수를 유효한 범위의 코드 상단으로 끌어 올리는 작업이다. var의 변수/함수의 선언만 위로 올려지고, 할당은 올려지지 않는다. let/const 변수 선언과 함수 표현식에서는 호이스팅이 발생하지 않는 것처럼 보인다. console.log(name) // 결과 undefined var name = "john" console.log(name) // 결과 john 위의 코드블록의 흐름을 보면 아래처럼 흘러간다. 그래서 두번째 줄의 console.log(name)에서 undefined가 나온다. var name console.log(name) name = "john" console.log(name) //error console.log(name) le.. 2022. 1. 15.
Javascript 원시자료와 참조자료 원시자료의 개념과 종류 원시자료는 원시 데이터 타입, 원시형이라고 불리며, 객체가 아니면서 메소드도 가지지 않는 어떠한 값을 의미한다. 1. 숫자(Number)는 정수 및 부동 소수점 숫자(Floating Point Number)를 나타낸다. 2. 문자열(String)은 따옴표로 감싼 문자 또는 문자열을 나타낸다. 이때 허용되는 따옴표는 총 세 가지로 작은 따옴표 'string', 큰 따옴표 "string" , 백틱 `string`가 있다. 작은 따옴표와 큰 따옴표는 기능상 차이점은 없지만 백틱의 경우에는 코드 예제와 같이 복잡한 문자열 연산을 간단히 표현할 때 사용한다. 변수나 수식이 들어가야 할 공간에 ${} 기호를 쓴 뒤에 안에 변수나 수식 등을 작성하면 된다. 3. 불린(Boolean)은 true.. 2022. 1. 13.
JSX 개념과 문법 JSX 개념 및 장점 JSX는 자바스크립트의 확장 문법이다. JSX는 브라우저에서 실행되기 전에 코드가 번들링되는 과정에서 바벨을 사용하여 일반 자바스크립트 형태의 코드로 변환이 된다. //JSX function App() { return( Hello react ); } //javascript function App(){ return React.createElement("div", null, "Hello", React.createElement("b", null, "react")); } 위의 코드블럭에서 보는 것처럼 JSX문법을 사용하는 것이 가독성이 좋고 작성하기 쉽다는 장점이 있다. 또한 컴포넌트들을 HTML 태그 쓰듯이 작성할 수 있어 더 높은 활용도를 경험할 수 있다. JSX 문법 요소 여러 개가 .. 2022. 1. 12.
프론트엔드 React 기초 알아보기 Recat 소개 React는 javascript를 쉽고, 효율적으로 사용할 수 있도록 페이스북에서 만든 도구이다. React를 활용하여 만든 대표적인 서비스로는 페이스북, 인스타그램, 에어비앤비 등이 있다. 라이브러리와 프레임워크 라이브러리 : 개발의 세계에서 라이브러리는 이미 누가 만들어 놓은 기능을 의미한다. 프론트엔드에 유명한 라이브러리는 React랑 JQuery가 있다. 프레임워크 : 프레임워크는 템플릿과 비슷하며, 이미 만들어진 구조물에서 제공하는 기능을 활용하여 만들어야 한다. 장점은 여러 사람들과 협업할 때 모두가 같은 기능을 사용하기에 유지보수에 좋다. 하지만 단점으로는 프레임워크에서 제공하는 기능을 사용해야한다. 대표적인 프레임워크는 Angular와 Vue가 있다. 프로그램 및 프로젝트 .. 2022. 1. 10.