본문 바로가기
728x90

FrontEnd81

즉시 실행 함수 ( IIFE ) 정의되자마자 즉시 실행되는 함수 입니다. 소괄호 () 로 함수를 감싸서 실행하는 문법을 사용합니다. ex) (function (){ console.log("안녕하세요"); })(); (()=>{ console.log("화살표 함수도 가능합니다"); })(); 기명함수로 사용할 수 있지만 재사용을 할 수 없기 때문에 익명함수로 사용합니다. Why Use? 필요없는 전역 변수 생성을 줄일 수 있습니다. 즉시 실행 함수를 선언 시 내부 변수가 전역으로 저장되지 않아 전역 스코프의 오염을 줄일 수 있습니다. 2. 보호 가능한 변수를 만들 수 있습니다. 즉시 실행 함수는 외부에서 접근할 수 없는 자체적 스코프를 가져 외부 로부터 변수를 보호할 수 있습니다. How Use? 초기화 ex) let isAdult; (.. 2022. 12. 5.
함수 선언과 변수 선언의 차이 있음을 알려주는 선언( Declaration ) VS 무엇인지 알려주는 정의 ( Difinition ) 선언 ( Declaration ) 코드의 일부로 변수 나 함수 가 있음 을 알려주는 것입니다. ex) let x ; // 변수를 선언 합니다. 정의 ( Difinition ) 코드 일부로서 변수 나 함수 가 무엇인지 알려주는 것입니다. ex) function x(){...} // 함수를 정의 합니다. 2022. 12. 5.
함수를 사용하는 이유 코드의 재활용에 효과적입니다. 1. 함수는 여러번 호출할 수 있습니다. 동일한 작업이 진행되면 효율적이며, 유지보수의 편의성 을 높이고, 코드의 신뢰성 을 높입니다. 2. 함수는 객체 타입의 값 으로 식별자 (이름 ) 을 선언합니다. 네이밍 을 통해서 함수의 역할을 잘 나타낸다면 가독성을 높일 수 있습니다. 2022. 12. 5.
BoxModel 문서의 요소를 하나의 직사각형 박스 로 여기는 모델입니다. CSS는 박스의 크기, 위치, 속성( 색, 배경, 테두리 모양 등 ) 을 결정합니다. 내용 영역 ( Content Area ) : 글, 이미지, 비디오 등 요소처럼 실질적인 내용 부분 입니다. 패딩 영역 ( Padding Area ) : 내용과 테두리 사이의 간격입니다. ( 눈에 보이지 않습니다.) 테두리 영역 ( Border Area ) : 내용과 패딩 주변을 감싸는 테두리 입니다. 마진 영역 ( Margin Area ) : 테두리 영역과 인근 요소 사이의 빈 공간까지 포함합니다. ( 눈에 보이지 않습니다.) box-sizing 기본값은 content-box 이며, 상속, 애니메이션 은 적용되어 있지 않습니다. box-sizing: conten.. 2022. 12. 5.
CSS ( Cascading Style Sheets ) What ?CSS ( Cascading Style Sheets )브라우저 에서 페이지 외형을 결정하는 선언형 언어 입니다.웹 페이지의 스타일을 지정하고 레이아웃을 지정하는 데 사용 됩니다. 웹의 핵심 기술  HTML , JS , CSS  중 하나로 HTML 요소의 스타일 을 결정합니다. 구성중괄호 는 코드 오류를 줄이기 위한 선택사항입니다.사용 방법1. 속성 처럼 Style 적용합니다.ex) // style 속성 사용 예시입니다.​2. Style Tag 를 적용합니다.ex) // style-tag 사용함 h1{color : yellow, text-align : center;}​3. css 파일을 별도로 만들어 HTML 파일에 연결합니다.ex) //css파일 (확장자 .css)을 만듭니다.// text.c.. 2022. 12. 1.
구조 분해 할당 배열, 객체 을 해체해 변수에 값을 담는 표현식 입니다. 객체나 배열에 저장된 데이터 전체가 아닌 일부 만 필요한 경우 사용합니다. 1. 배열 ( array ) 구조 분해 할당 할당받을 변수를 왼쪽에, 분해할 대상을 오른쪽에 대입해 작성합니다. ex) let [a, b] = [10, 20]; console.log(a); // 10 console.log(b); // 20 const array = [1, 2, 3]; const [first] = array; console.log(first); // 1 대응되지 않은 인수 는 Rest 파라미터 로 묶어 배열로 데이터를 저장할 수 있습니다. //Rest 파라미터 사용 let array = [1, 2, 3, 4, 5]; let [a, b, ...rest] = ar.. 2022. 11. 29.
728x90

티스토리툴바