분류 전체보기

자바스크립트 제어문 살펴보기!

제어문 제어문(control flow statement) - 조건에 따라 코드 블록을 실행(조건문)하거나 반복 실행(반복문) 할 때 사용. 제어문을 사용하여 코드의 실행 흐름을 인위적으로 제어 1. 블록문 블록문(block statement/compound statement) - 0개 이상의 문을 중괄호로 묶은 것. 코드 블록 또는 블록이라고 부르기도 함. // 블록문 { var foo = 10; } // 제어문 var x = 1; if(x < 10) { x++; } // 함수 선언문 function start(a,b){ return a+b; } 2. 조건문 조건문(conditional statement) - 주어진 조건식(conditional expression)의 평가 결과에 따라 코드 블록(블록문)..

연산자

연산자 연산자 - 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입, 지수 연산 등을 수행해 하나의 값을 만듦. 이때 연산의 대상을 피연산자(값으로 평가될 수 있는 표현식)이라 함. 1. 산술 연산자 산술 연산자(arithmetic operator) - 피연산자를 대상으로 수학적 계산을 수행해 새로운 숫자 값을 만듦. 산술 연산지 불가능한 경우 NaN을 반환. 1. 이항 산술 연산자 이항(binary) 산술 연산자 - 2개의 피연산자를 산술 연산하여 숫자 값을 만듦. 이항 산술 연산자는 피연산자의 값을 변경하는 부수 효과 없이 새로운 값을 만든다. 이항 산술 연산자의미부수 효과 + 덧셈 X - 뺼셈 X * 곱셈 X / 나눗셈 X % 나머지 X 2. 단항 산술 연산자 단항 산술 연산자의미부수..

데이터 타입!

데이터 타입 자바스크립트의 모든 값은 데이터 타입을 갖는다 구분 데이터 타입 설명 원시타입 숫자number 타입 숫자. 정수와 실수 구분 없이 하나의 숫자 타입만 존재 문자열string 타입 문자열 불리언boolean 타입 논리적 참(true)와 거짓(false) undefined 타입 undefined null 타입 null 심벌symbol 타입 ES6에서 추가된 7번째 타입 객체 타입 객체, 함수, 배열 등 1. 숫자 타입 자바스크립트는 모든 수를 실수로 처리하며, 정수만 표현하기 위한 데이터타입이 별도로 존재하지 않는다. //모두 숫자 타입이다. var integer = 100; // 정수 var double = 0.1; // 실수 var negative = -10; // 음의 정수 정수, 실수, ..

표현식과 문!

표현식과 문 개념을 이해한다는 것은 용어를 정확히 이해하고 설명할 수 있다는 것 1. 값 값(value) - 식(표현식 expression)이 평가(evaluate)되어 생성된 결과 평가 - 식을 해석해서 값을 생성하거나 참조하는 것 참조 - 변수에 저장된 값을 읽어 들이는 것 //10 + 20은 평가되어 숫자 값 30을 생성한다. 10 + 20; // 30 모든 값은 데이터 타입을 가지며, 메모리에 2진수, 즉 비트의 나열로 저장 메모리에 저장된 값은 데이터 타입에 따라 다르게 해석 (ex 0100 0001 숫자로 해석하면 65, 문자로 해석하면 'A') 값은 다양한 방법으로 생성하지만 기본적인 방법은 리터럴을 사용하는 것 2. 리터럴 리터럴(literal) - 사람이 이해할 수 있는 문자 또는 약속된..

자바스크립트의 변수!

변수 1. 변수란 무엇이고? 왜 필요한가 컴퓨터는 CPU를 사용해 연산하고, 메모리를 사용해 데이터를 기억한다. 메모리는 데이터를 저장할 수 있는 메모리 셀의 집합체 메모리 셀 하나의 크기는 1바이트이며, 컴퓨터는 메모리 셀의 크기로 데이터를 저장하거나 읽어 들인다. 각 셀은 메모리 공간의 위치를 나타내는 메모리 주소를 가진다. 컴퓨터는 모든 데이터를 2진수로 처리 -> 숫자, 텍스트, 이미지, 동영상 등 ex) 10,20 같은 값도 2진수로 저장됨(위의 그림은 편의상 10진수로 표기) 10 + 20 위 코드처럼 컴퓨터에서 실행을 하면 연산을 실행하고 결과도 메모리에 저장한다. 문제점 -> 결과값을 재사용 할 수 없음 위처럼 연산을 했다는 것은 그 결과가 필요하고 사용하겠다는 것인데 메모리 공간에 직접 ..

(쓰면서 익히는 알고리즘과 자료구조) chapter1. 배열

배열 1.1 배열이란? 연속적인 메모리 공간에 저장된 아이템의 집합을 표현하는 자료구조 파이썬에서 배열 사용 방법으로는 리스트(여러 타입을 하나의 자료구조에 담을 수 있음)와 Array(초기화 하는 시점에 정해진 하나의 타입만) 모듈이 있다 1.2 파이썬에서 배열(리스트 사용법) 1.2.1 리스트(List) 여러 타입의 요소를 가질 수 있음 리스트 초기화 py_list_empty=[] py_list=[1,2,3,4,5] # 0을 10개 가지는 리스트 초기화 py_list_zeros_1=[0 for i in range(10)] py_list_zeros_2=[0]*10 리스트 요소 추가 및 삭제 # 추가 - append() py_list=[1,2,3,4,5] py_list.appned(6) #[1,2,3,4..

ES6. includes()로 존재 여부를 확인하라

string.indexOf(searchvalue,position) - indexOf 함수는 문자열에서 특정 문자열(searchvalue)를 찾고, 검색된 문자열이 첫번째로 나타나는 위치 index를 리턴 - searchvalue : 필수값, 찾을 문자열 - position : 기본값은 0, string에서 searvalue를 찾기 시작할 위치 const sections = ['shipping']; function displayShipping(sections){ if(sections.indexOf('shipping')){ return true; } return false; } -> if(0)이 되므로 false값을 반환하게 된다 - includes() 배열 메서드를 이용하면 값이 배열에 존재하는지에 따라 ..

(리액트를 다루는 기술) 8장 Hooks

Hooks Hooks는 리액트 v16.8에 새로 도입된 기능으로 함수형 컴포넌트에서도 상태 관리를 할 수 있는 useState, 렌더링 직후 작업을 설정하는 useEffect 등의 기능을 제공 useState useState는 가장 기본적인 Hook이며, 함수형 컴포넌트에서도 가변적인 상태를 지닐 수 있게 해줌. App.js; import React from "react"; import Counter from "./Counter"; const App = () => { return ( ); }; export default App; Counter.js; import React, { useState } from "react"; const Counter = () => { const [value, setValue..

(리액트를 다루는 기술) 6장 컴포넌트 반복

컴포넌트 반복 자바스크립트 배열의 map()함수 문법 array.map(callback, [thisArg]) callback : 새로운 배열의 요소를 생성하는 함수로 파라미터는 3가지 currentValue : 현재 처리하고 있는 요소 index : 현재 요소의 index 값 array : 현재 처리하고 있는 원본 배열 var numbers=[1,2,3,4,5]; number.map(function(c,i,a){ console.log(c,i,a)}) 1 0 [1, 2, 3, 4, 5] 2 1 [1, 2, 3, 4, 5] 3 2 [1, 2, 3, 4, 5] 4 3 [1, 2, 3, 4, 5] 5 4 [1, 2, 3, 4, 5] 데이터 배열을 컴포넌트 배열로 변환 import React from "react..