전체 글 123

자바스크립트 기본 - if와 ? 조건 처리 , switch

if 문의 괄호 안에서도 표현식을 평가한다. 이후 그 결과를 boolean 값으로 변환한다. - 숫자 0 , 빈 문자열 "" , null , undefined , NaN은 boolean으로 변환시 모두 false 이다. falsy값 이라고 부른다. - 이 외의 값은 boolean으로 변환시 true 이다. truthy값 이라고 부른다. 조건부 연산자 ( ? ) aka. ternary operator 자바스크립트에서 피연산자를 3개나 받는 연산자는 조건부 연산자가 유일합니다. 피연산자가 3개 이므로 삼항 연산자 라고도 불립니다. let passedTest = 80

자바스크립트 기본 - 기본연산자와 수학

피연산자를 하나만 받는 연산자를 단항 연산자라고 부른다. 피연산자를 2개 받는 연산자를 이항 연산자라고 부른다. 1. 마이너스 연산자 ( - ) 단항 마이너스 연산자는 부호를 뒤집어 준다. 이항 마이너스 연산자는 뺄샘을 해준다. let num = 1; num = -num; console.log(num) // -1 2. 플러스 연산자 ( + ) 단항 플러스 연산자는 피연산자가 숫자일 경우 아무런동작을 하지 않는다. 단항 플러스 연산자는 피연산자가 숫자가 아닌경우 숫자형으로의 변환이 일어난다. 단항 플러스 연산자( + ) 하나로 Number( ... ) 와 같은 일을 할 수 있다. let num1 = 1 console.log(+num1) // 1 -> number let num2 = -1 console.lo..

자바스크립트 기본 - 상호작용

모달(modal) = 메세지가 있는 작은 창 이라는 뜻 , 페이지의 나머지 부분과 상호작용 불가능 하다는 의미 내포 alert, prompt, confirm 함수 실행시 제약사항 2가지 - 모달 창의 위치는 브라우저가 결정. 보통 중앙에 위치한다. - 모달 창의 모양은 브라우저마다 다르고 수정할 수 없다. prompt 실행하면 텍스트 메세지와 입력필드 , 확인 , 취소 버튼이 있는 모달 창을 띄워준다. let result = prompt(title, [default]); 매개변수는 2가지 이다. title -> 사용자에게 보여줄 텍스트 메세지 default -> 입력필드에 나타낼 초깃값 ( 선택값 ) default를 감싸는 [ ] 는 필수값이 아닌 선택값이라는 것을 의미한다. 사용자가 입력필드에 값을 입..

자바스크립트 기본 - 자료형

자바스크립트에는 8가지 자료형이 있습니다! 1. 숫자형 - 정수 및 부동소수점 숫자를 나타냅니다! - Infinity , -Infinity , NaN 같은 특수 숫자 값 도 포함됩니다 1-1. infinity 어떠한 숫자보다 더 큰 값 , 즉 무한대를 나타냅니다. 아무 숫자를 0으로 나누면 Infinity 값을 얻을 수 있습니다. Infinity는 직접 참조할 수 있습니다. 1-2. NaN (Not a Number) 계산중에 에러가 발생했다는 것을 나타내주는 값 입니다. 부정확하거나 정의되지 않은 연산이 실행되면 NaN을 반환합니다. 자바스크립트에서는 문자열을 숫자로 취급하는 등의 비상식적인 연산이 가능합니다. 이러한 연산을 하더라도 NaN을 반환할 뿐 에러를 띄우지 않습니다! 2. BigInt 내부의 ..

자바스크립트 기본 - 변수와 상수

변수는 데이터를 저장할 때 쓰이는 '이름이 붙은 저장소"입니다. 자바스크립트에서는 let을 사용해 변수를 선언합니다. 한 줄에 여러 변수를 선언할 수도 있지만 권장하지 않습니다. 중복해서 선언하면 에러가 발생합니다. 오래된 스크립트에서는 var를 발견할 수 있습니다. 스칼라(Scala) , 얼랭(Erlang) 등 함수형 프로그래밍 언어는 변숫값 변경을 금지합니다. 이러한 제약이 병렬 계산(동시에 여러 계산을 하는 연산의 방법) 같은 영역에선 장점으로 작용합니다! 변수명에는 문자와 숫자, $(달러) , _ (underscore)만 들어갈 수 있고 첫 시작이 숫자가 될 수 없습니다. 변화하지 않는 변수를 선언할 땐 const를 사용합니다. 상수(constant) 라고 부릅니다. 이름과 같이 할당한 값을 변경..

자바스크립트 기본 - 엄격 모드

자바스크립트는 기본의 기능을 변경하지 않고 새로운 기능을 추가하면서 발전했습니다. 그렇기에 코드가 망가지지 않는다는 장점과 함께 창시자들이 했던 실수들이 영원히 박제된다는 단점이 있었구요. 그러던 중 ECMA script5가 등장하면서 기존 기능중 일부가 변경되었습니다. 기존 기능을 변경하면서 생길 수 있던 호환성 문제를 해결하기 위해 엄격모드를 만들었습니다. ES5의 기본모드 에서는 변경된 기능이 활성화 되지 않고, 엄격모드를 활성화 했을 때에만 변경된 기능이 활성화 됩니다. "use strict" 라는 지시자를 스크립트 최상단에 써주면 스크립트 전체가 모던한 방식으로 동작됩니다. 브라우저 콘솔에는 기본적으로 엄격모드가 비활성화 되어있습니다. clsss와 모듈을 사용하면 엄격모드가 자동으로 활성화 됩니..

core javascript 정복

https://ko.javascript.info/ 모던 JavaScript 튜토리얼 ko.javascript.info 자바스크립트 계의 수학의 정석이라고 생각될 만큼 코어에 대한 정리가 완벽히 되어있는 위의 사이트를 보며 감탄과 반성을 했습니다. 항상 기본이 중요하다 했거늘... 예끼 이놈...! 가장 중요한 기초를 훑듯이 지나쳐온 제 자신을 반성하며 진행하던 모든 것을 멈췄습니다. 오늘부터 태초마을로 돌아가 보려 합니다. 위에 사이트의 모든챕터를 공부하면서 제가 몰랐던 부분이나 애매모호하게 알고있던 부분들을 메모장에 정리하듯 공부하고 싶어 따로 만든 카테고리입니다. 공부가 목적인 만큼..! 본문을 따라쓰는 건 의미가 없다는 것을 압니다! 본문의 예제를 직접 만들어 보며 최대한 내껄로 만든다는 느낌으로 ..

자바스크립트 - class, getter, setter 란 ?

여태 class가 뭔지 몰랐던것을 반성하며 포스팅합니다잇 ! 1. class란? ES6에서 새롭게 추가된 'class' 기존에 존재하던 prototype을 베이스로 문법만 추가된 것이라고 합니다! (나중에... 꼭.. 알아보쟈..) 클래스는 연관있는 데이터를 한 곳에 묶어놓는 일종의 컨테이너 인데유~ 속성(fields) 과 행동(methods)이 정의되어 있습니다! class는 일종의 틀인데요~ 이것을 이용해서 데이터를 넣어 찍어내면? object를 만들 수 있습니다~ class는 한번만 선언하면 되고 여러번 재사용 할 수 있습니다~~~ 백문이 불여일견 만들면서 이해해 봅시댜잇! 1-1. class 선언하기! class 키워드로 시작해서 Person 이라는 class 를 만들겠슴다. constructor..

Frontend/JS 2021.11.04

자바스크립트 - 프로퍼티 플래그 , 설명자란?

자바스크립트 기본기를 잘 갖추지 않고 리액트니 뭐니 쓰고있던 나. 초보방을 스킵하고 고수방을 들락날락 거리다 패배의 쓴맛을 본 이 시점에 빨리 공부 해줘야한다. 자자 가봅시다~ 레고~ 1. 프로퍼티 플래그( property flags )란? 객체는 키(key) + 값(value) 쌍으로 이루어진 프로퍼티(property)가 저장된 친구에요. 저는 객체가 이게 다 인줄 알았습니다... 하지만 놀랍게도 프로퍼티는 값(value) 과 함께 플래그(flag)라고 불리는 특별한 속성 세 가지를 갖습니다!!! 모두 true 나 false 값을 가집니다잇! 1. writable -> 값(value) 수정이 가능한지 여부입니다. [ write = 쓰다 ] 2. enumerable -> 반복문을 사용해 나열 가능한지 여..

Frontend/JS 2021.10.25