개발/자바스크립트 14

자바스크립트 변수 선언의 특징

특징 "변수 호이스팅" , 변수를 어디서 선언을 하든 변수 선언이 맨 앞으로 간다 변수 선언의 범위 var 를 사용해 선언된 변수는 가장 가까운 함수 범위를 갖는다 let 을 사용해 선언된 변수는 가장 가까운 블록범위를 갖는다 (즉 { } 내에서 사용가능하다) function scope2(print){ if(print){ var insideIf = '12'; } console.log(insideIf); } scope2(true); //'12'가 출력된다 function scope3(print){ if(print){ let insideIf = '12'; } console.log(insideIf); } scope3(true); //오류 발생 !!! **자바에서는 If 내부에 선언된 변수는 외부에서 사용할 수..

자바스크립트 배열의 크기 변경

자바스크립트의 배열의 큰 특징은 배열의 크기를 임의로 변경 가능하다는 것이다 var arr = [ 1234, 'test' , true ]; //배열의 크기를 임의로 변경 (3->5) //arr[3],arr[4]는 값이 할당되지 않았기 때문에 undefined arr.length=5; //새로운 배열을 추가하면 크기는 자동으로 변경 (5->6) arr[5]='apple'; //새로운 배열을 추가하면 크기 변경 (6->7) arr.push('banana'); for (var i=0; i

클래스와 함수생성자

클래스와 객체 객체 클래스의 인스턴스 이다 1개의 클래스로 여러개의 객체를 만들 수 있다 객체 안에는 데이터가 있다. 메모리에 올라간다 클래스 템플릿 같은 역활을 한다 한번만 선언한다 클래스 안에는 데이터가 없다 메모리에 올라가지 않는다 클래스 선언 생성자 Constructor 생성자는 객체를 생성할 때 인자를 프로퍼티에 전달하여 생성 class Person { name='mike'; age=19; } //인스턴스 생성 let person= new Person(); class User { constructor(name) { // setter를 활성화합니다. this.name = name; } } //인스턴스 생성 let user=new User(name); 동적으로 선언 getter 와 setter cl..

자바스크립트 모달창만들기

1. 모달창 작성 import styled from "styled-components"; import { Button } from "components"; import { myTheme } from "style"; const { fonts, colors } = myTheme; function POPUP(props) { //프롭스로 set hook등을 받아와야함 매우중요 const { open, close, title, content } = props; return ( // 아래에 open?을 물어보는 삼항 연산자로 인해 modal창이 열림 매우중요 ! {title} x {content}{" "} ); } export default POPUP; //위치 고정과 배경이 검정색이 됨 그리고 z-index가 컴..