전체 글
-
JavaScript 타입변환과 연산자프로그래밍/JavaScript 2022. 9. 26. 11:20
자바스크립트의 타입은 유연한 성격을 지니고 있어 타입이 고정되있지 않고 변수에 다른 타입의 값을 대입하는 것이 가능하다. 타입 변환은 자동 타입 변환(암시적)과 강제 타입 변환(명시적)으로 나뉜다. 자동 타입 변환 자동 타입 변환은 타입의 값을 기대하는 곳에 다른 타입의 값이 오면 자동으로 타입을 변환한다. const a = "20"; // 문자열형 const b = "10"; // 문자열형 let result = a + b; // 2010, 문자열 연결 let result2 = a - b; // 10 let result3 = a * b; // 200 let result4 = a / b; // 2 const c = "자바스크립트"; let result5 = c - a; // NaN : 숫자로 변환할 수 ..
-
나는 짧게 일하고 길-게 번다일상/독서 2022. 9. 25. 19:03
오늘의 책은 저자인 레이철 리처즈의 "나는 짧게 일하고 길-게 번다"라는 책이다. 책 표지에서부터 재테책임을 눈치챌 수 있다. 책에서는 경제적 자유를 이루기 위한 방법들을 소개하는 책으로 어렵지 않게 읽은 책이다. 이 책의 저자인 레이철 리처즈에 대해 먼저 소개를 해보면, 27세에 월 천만 원 이상이 들어오는 자신만의 소득시스템을 구축하여 조기 은퇴을 이루었다. 24세에 대학에서 금육경제학을 전공하고 재무상담사로 일하면서 임대 부동산에 투자하였고 주문형 티셔츠 인쇄사업과 책 출간 등 근로 소득 이외에 월 1만 달러 이상의 현금흐름을 만들었다. 그녀는 수동적 소득이라는 개념을 소개하며 일하지 않고도 소득이 들어오는 시스템을 통해 2년만에 수동적 소득이 근로소득을 넘어서 더 이상 일을 하지 않아도 본인이 원..
-
JavaScript 데이터 타입프로그래밍/JavaScript 2022. 9. 25. 10:48
숫자형(number) 자바스크립트에서는 정수와 실수를 따로 구분하지않고 모든 수를 실수 하나로만 표현한다. typeof()는 타입을 반환해주는 함수로 타입 확인간 사용한다. 문자열형(string) 따옴표로 둘러싸인 문자의 집합으로 작은 따옴표와 큰 따옴표를 상관하지 않는다. 불리언형(boolean) 참 또는 거짓으로 표현되는 값이다. undefined, null 형 undefined은 자료형이 정의되지 않았을 때, 데이터 상태(변수에 값이 할당되지 않았은 상태)를 의미한다. null은 변수에 할당된 값이 유효하지 않음을 의미한다. 객체형 여러 속성을 하나의 변수에 저장할 수 있도록 해주는 타입으로 키와 값의 구조로 저장한다. 심볼형 심볼형은 유일하고 변경 불가능한 기본값을 만들어 객체 속성의 key값으로..
-
JavaScript 변수, 상수프로그래밍/JavaScript 2022. 9. 25. 10:40
변수 변수는 데이터를 저장하여 담을 수 있는 메모리 공간을 의미한다. 변수를 사용하기위해서 변수에 이름을 붙여 주어야하는데, 이것을 변수 선언이라고 한다. 자바 스크립트에서 변수를 선언할 때는 지켜야 할 몇가지 규칙이 있다. 변수 선언의 규칙을 알아보자. 변수 이름은 영문자와 언더바(_), 숫자를 사용한다. 단 변수 이름 첫 글자는 영어 대소문자나 언더바(_)만을 사용할 수 있고 숫자, 기호 띄어쓰기는 허용하지 않는다. 대소문자를 구별하고 예약어는 변수 이름으로 쓸 수 없다. var, let, const, while .. 등 예약어는 불가능하다. 여러 단어로 연결된 변수 이름의 경우, 중간 글자 어미를 대문자로 적는다. 예로 currentYear, CurrentYear, current_Year, Curr..
-
JavaScript 대화상자프로그래밍/JavaScript 2022. 9. 24. 06:30
alert() 웹 브라우저에서 작은 알림창을 열어 사용자에게 메시지를 보여주고 확인을 기다리는 방법이다. alert('안녕하세요?'); confirm() 알림창은 단순히 메시지를 보여주는 기능만 하지만 확인차은 사용자가 확인이나 취소 버튼 중에서 직접 클릭할 수 있다. 확인을 누를 경우 true, 취소를 누를 경우 false를 반환한다. confirm('확인 또는 취소를 눌러주세요.'); prompt() 프롬프트 창은 텍스프 필드를 포함하고 있는 창이다. 텍스트 필드 안에 간단한 메시지를 입력후 결과를 반환한다. prompt('이름을 입력하세요'); console.log(`당신의 이름은 ${name} 입니다.`); console.log(`name의 타입 : ${typeof name}`);
-
자바스크립트(JavaScript) 들어가기프로그래밍/JavaScript 2022. 9. 22. 19:28
자바 스크립트는 모질라 재단의 프로토타입 기반의 프로그래밍 언어로, 스크립트 언어에 해당된다. HTML은 웹 문서의 내용을 구성하고, CSS는 웹 문서의 레이아웃이나 색상, 스타일 등을 지정한다. 자바스크립트를 추가하면 웹 문서의 각 요소를 가져와 필요에 따라 스타일을 변경하거나 움직이게 할 수 있다. 웹 문서를 자동차에 비유하자면, HTML은 자동차의 뼈대, CSS는 자동차의 외관, JavaScript는 자동차의 동력이라고 볼 수 있다. 객체 기반의 스크립트 프로그래밍 언어로 웹 브라우저 내에서 주로 사용되며, 다른 응용 프로그램의 내장 객체에도 접근할 수 있는 기능을 가지고 있으며, 웹 문서에는 자바스크립트 소스를 읽고 처리하는 해석기 기능이 존재한다. 자바스크립트 소스는 웹 문서에서 콘솔에 출력한 ..
-
text-overflow프로그래밍/HTML&CSS 2022. 9. 21. 19:31
웹 문서에서 정해진 공간 안에 텍스트의 양이 많을 경우 텍스트를 중간에 끊고 뒤에 ‘…’ 으로 마무리 지어버리는 것을 본 적이 있을 것이다. 이러한 세부적인 텍스트 스타일에 대해 다뤄볼 것이다. 이와 관련한 속성으로 overflow, text-overflow, white-space가 있다. text-overflow 택스트가 기준선(상자)을 벗어나 넘칠 경우 넘치는 텍스트를 어떻게 처리할지 설정한다. 속성값으로는 clip과 ellipsis가 있다. clip은 기본값으로 넘칠 부분을 중간에 자르는 속성값이고 ellipsis는 clip으로 자른 부분 뒤에 ‘…‘를 붙이는 속성값이다. text-overflow를 사용하기 위해서는 두가지의 조건에 충족해야한다. overflow가 hidden, scroll, aut..
-
animation프로그래밍/HTML&CSS 2022. 9. 20. 19:26
animation은 transition보다 더 쉽게 애니메이션 효과를 만들 수 있는 속성이다. animation은 연속적인 장면들(변화하는 지점)을 만드는 방법을 사용하며 이 연속된 지점들을 키프레임을 통해 지정할 수 있다. 먼저 @keyframes를 지정해주고 animation 속성으로 애니메이션 시간, 반복, 순방향 역방향 등을 정한다. @keyframes 애니메이션의 장면들을 순서와 함께 지정하고 모아놓은 집합체라고 볼 수 있다. @keyframes { { } } @keyframes moving { from { width: 200px; background-color: gold; opacity: 0.5; /*투명도*/ transform: scale(0.5) rotate(30deg); } to { wi..