[Javascript] 기초 학습

상수 어떠한 자료에 이름을 붙이는것 이다. 상수 만들기 const 식별자 = 자료; -> 고정된 형태이다(다르게 쓰면 오류). 주의 // 상수는 우선 한번 선언하면 후에 중복해서 선언할수 없다. 크롬 콘솔에선 가끔 중복선언이 허용될때가 있는데 에러

이걸 보면, a = a + 1 이라는 식이 변수에 한번 실행때마다 1씩 증가시켜준다는 식인데, 이러한 식을 간단하게 쓸수있는 연산자가 '+='이다.a += 1 은 a에 1씩 증가시켜 준다는 의미이다.반대로 a = a - 1은 a -= 1 과 같다.당연히 상수에는 적용이

prompt는 사용자가 텍스트를 입력할 수 있도록 안내하는 선택적 메세지를 갖고 있는 대화 상자를 띄운다.사용자에게 보여줄 문자열, 프롬프트 창에 표시할 메세지가 없으면 생략할 수 있다.우선 콘솔창에 띄워보자.이런식으로 화면에 대화상자를 띄운다.상수를 선언하고 만들어본

\-원하는 자료형으로 변환시켜줄 함수-Number() 다른 자료형 -> 숫자String() 다른 자료형 -> 문자열Boolean() 다른 자료형 -> 불(true,false값)String(123) -> '123' 와 같이 ''안에 값을 넣어주면 문자열이 된다.Numbe

자바스크립트에서 가장 일반적인 조건문은 if 조건문 이다.불 표현식의 값이 true면 중괄호 안의 문장을 실행하고 false이면 문장을 무시한다.\-if 조건문의 기본틀-if(불 값이 나오는 표현식){ 불 값이 참일때 실행할 문장} false일때 나올 문장(생략하면

자바스크립트에는 if조건문 외에도 조건 분기에 활용할 수 있는 구문이 많다.대표적으로 switch 조건문 , 조건부 연산자(삼항 연산자), 논리 연산자를 활용한 짧은 조건문이 있다.조건문 종류\-if 조건문\-switch 조건문\-조건부 연산자를 활용한 조건 분기\-논

조건부 연산자는불 표현식 ? 참일때의 결과 : 거짓일때의 결과 로 쓰인다.이렇게 쓰고, prompt()를 써서 나오는 입력상자에 1을 입력하면 불 표현식에 맞는 참 이므로 참일때의 결과인 '0 이상의 숫자입니다'가 alert()를 써서 나오는 경고 대화 상자가 나올것

배열(array)은 여러 개의 변수를 한번에 선언해 다룰 수 있는 자료형이다. 배열은 대괄호 ...를 사용해 생성하고 내부의 값을 쉼표(,)로 구분해 입력한다.배열 내부에 들어 있는 값을 요소(element)라고 한다.어떠한 종류의 자료형도 요소가 될 수 있다.요소,

현대의 프로그래밍언어에서 사용할수 있는 자료는 크게 두가지로 구분을 할 수 있다.바로 기본 자료형과 복합 자료형이다.복합 자료형은 기본 자료형보다 훨씬 크다.기본 자료형은 스택(Stack)이라는 곳에 저장을 하고, 복합 자료형은 힙(Heap)이라는 곳에 저장을 한다.스

이전 글의 내용인 Stack & Heap 을 이해했다면 이 내용도 이해하기 쉽다. 어떠한 처리 후 원본이 변경되지 않는다 -> 비파괴적 처리어떠한 처리 후 원본이 변경된다 -> 파괴적 처리코드로 예를 들어본다.보이는 a + b 에서 + 연산은 비파괴적 처리라고 볼 수

컴퓨터에게 반복 작업을 시키는 것은 간단하다.반복 작업 코드를 복사해서 붙여 넣으면 된다.하지만 100번 1000번 10000번 혹은 무한히 반복하고 싶을 때 코드를 계속 붙여 넣는 것은 무리이다.이럴때 활용하는 것이 반복문이다. 배열과 함께 사용할 수 있는 반복문은

while 반복문은 if 조건문과 형태가 매우 비슷한 반복문이다.if 조건문과 다른 점은 문장을 한번만 실행하고 끝나는 것이 아니라 '불 표현식'이 true면 계속해서 문장을 실행한다.형태는 아래와 같다.while (불 표현식) { 문장}while 반복문의 경우 조건

먼저 예제로 알아보자.코드를 써보고 출력이 어떻게 되는지 본다.위의 코드를 실행해보면 4번째줄 console.log(text)가 출력이된다.하지만 바깥에 console.log(text)를 입력하면 어떻게 될까?레퍼런스에러가 나온다.첫번째 콘솔 출력 결과는 세번째 줄의

스코프는 두 가지 종류가 있다.하나는 블록 스코프(block scope)라고 부르며, 중괄호(블록)를 기준으로 범위가 구분된다.(두번째 예제의 변수 i는 중괄호 안에서만 사용할 수 있다)또다른 스코프 종류로는 함수 스코프(function scope)가 있다.functi

get(20)에서, 여기서 전달인자 20은 사용되지않는 값이다.20을 인자로 받아 함수에 전달해 주었지만 get함수 내부의 어떤 변수에도 할당되지 않는다.get 함수에 매개변수 x가 선언되어 있다.즉 get함수가 반환하는 x는 전역 스코프의 x가 아니라, get함수 스

함수를 알아보기 전에 몇 가지 용어를 정리해보자.함수를 사용하는 것을 함수 호출, 즉 '함수를 호출하다'고 표현 한다.함수를 호출할 때는 괄호 내부에 여러가지 자료를 넣는데, 이러한 자료를 매개변수라고 부른다.그리고 함수를 호출해서 최종적으로 나오는 결과를 리턴값 이라

매개변수로 숫자들의 배열을 입력하면 배열 내부에 있는 숫자 중에서 가장 작은 값을 구하는 함수를 만들어본다.알고리즘유형에 많이 출제됨!

기본 형태는 이러하다const 함수 = function(...매개변수) { console.log(매개변수)}나머지 매개변수의 자료형은 무조건 배열이다.일반적인 매개변수와 함께 사용할 수 있다.나머지 매개변수는 앞쪽에다 쓰지 않는다.코드를 실행 했을때, 에러가 발생함

매개변수 배열,기본자료형 의 최대값 구하기!한번써보면서 이해해보자.

구 버전의 자바스크립트에서 가변 매개변수 함수를 구현할 때는 배열 내부에서 사용할 수 있는 특수한 변수인 arguments를 활용한다.arguments는 매개변수와 관련된 여러 정보를 확인할 수 있고 배열과 비슷하게 사용할 수 있다.실행결과를 보면 arguments는

함수를 매개변수로 사용하여 넣을수 있다.아래는a is not a function -> a가 함수가 아닌데 왜 호출하려고 하냐? 라는 에러가뜸콜백함수를 활용하는 가장 기본적인 함수 forEach()이다.배열이 갖고 있는 함수(매서드)로써 단순하게 배열 내부의 요소를 사용

자바스크립트에서 콜백함수를 사용하는 또 다른 대표적인 함수가 바로 타이머 함수이다.타이머 함수는 크게setTimeout()setInterval()이라는 함수로 나뉜다.둘다 특정한 시간 후에 뭘 할때 사용을 한다.setTimeout(함수,시간) -> 특정 시간 후에 함수

while반복문과 for반복문은 2가지 모두 많이 사용되지만,사용하는 상황이 조금씩 다르다.while반복문은 조건을 중심으로 반복할때,for반복문은 횟수를 중심으로 또는 배열 등을 중심으로 반복할 때 사용한다.그런데 익명함수와 선언적 함수는 사용하는 상황이 비슷하다.기

우선 객체의 기본에 대해서는 여러번 정리를 해서 간단하게 다뤄보겠다.객체(object)란 추상적의미로, 한마디로 정의하면'실제로 존재하는 사물'을 의미하고 '이름'과 '값'으로 구성된 속성(property)을 가진 자바스크립트의 기본 데이터 타입으로 이야기할수 있다.이

// 객체의 키와 값을 정적으로 생성한다!const obj = { a: 1, b: 2, c: 3}// 객체의 키와 값을 동적으로 생성한다!obj.d = 4;console.log(obj) -> {a:1,b:2,c:3,d:4}와 같이 객체가 한번 만들어진 이후에obj

자바스크립트에서 사용하는 자료는 크게 기본자료형(primitives)과 객체자료형(object)으로 구분할 수 있다. 앞서 공부했던 [기본자료형 복합자료형](https://velog.io/@hyo123/Stack%EA%B3%BCHeap-%EA%B7%B8%EB%A6%A

Number 객체에서 자주 사용하는 메소드 toFixed() 이다소수점 이하 몇 자리까지만 출력하고 싶을 때 사용한다.소수점을 가진 숫자.toFixed(나타낼 소수점자리수)출력된 자료형의 타입은 'string' 이다NaN(Not a Number) ->자료형은 숫자인데

JSON은 JavaScript Object Notation 의 약자로 자바스크립트의 객체처럼 자료를 표현하는 방식이다.인터넷에서 문자열로 데이터를 주고 받을 때 CSV, XML, CSON 등의 다양한 자료 표현 방식을 사용할 수 있다.현재 가장 많이 사용되는 자료 표현

객체에 없는 속성에 접근하면 undefined 자료형이 나온다.따라서 조건문으로 undefined인지 아닌지 확인한다면 속성 존재 여부를 확인할 수 있다.if문 사용if(obj.키 !== undefined)로도 쓸수 있지만객체의 특정 속성이 false로 변환될 수 있는

간단한 프로그램을 만들때 HTML 페이지 내부에 script 태그를 만들고 태그 내부에 자바스크립트 코드를 입력하였다.하지만 프로그램의 규모가 커지면 파일 하나가 너무 방대해지기 때문에 파일을 분리하는게 좋다.알아보자.우선 아무 폴더를 생성하고, 폴더안에 파일 두개를

클로저란? 1.함수와 함수가 선언된 어휘적 환경의 조합 2.함수를 리턴하는 함수 3.외부의 함수의 변수에 접근할 수 있는 내부함수\-> 함수를 리턴하는 함수이면서 외부의 함수의 변수에 접근할 수 있는 내부함수를 바로 클로저라고한다.특징 1. 함수를 리턴하는 함수여기 덧

정답 : sample함수가 리턴 하고 있는 익명함수 설명 : sample이 리턴하는 익명함수는 외부함수 sample의 스코프에 선언된 변수 value에 접근할 수 있기 때문에 클로저이다.

위의DOMContentLoaded 이벤트는 웹 브라우저가 문서 객체를 모두 읽고 나서 실행하는 이벤트이다. 위와같이 코드를 구성하면다 읽고난 상태가 되었을때 , 콜백 함수를 호출한다. 쉽게말해 컴퓨터가 위에서부터 순서대로 읽어 내려가는게 아닌 우선 다읽어들이고 난 뒤에

배열 기초배열은 순서가 있는 값 순서는 인덱스(index)라고 부르며, 1이 아닌 0부터 번호를 매긴다.0 2 인덱스(index)10 5 9 25 \-> 배열은 순서가 있는 값! Ex1) let number = 2, 4,

우선 객체의 예제를 한번 알아본다.회원 주소록을 만들어본다고 가정해본다.위와 같이 매번 이런 식으로 여러 개의 변수를 꼭 선언해야할 필요가 없다.이럴때 객체를 쓸수있다.우선 배열로 써본다.위 처럼 배열로 써보았을때, 각 값이 하나의 변수로 묶여있긴 하지만,이 경우에는

반복문은 같거나 비슷한 코드를 여러 번 실행시켜야 할 경우에 쓰는 구문!위의 조건을 코드로 써본다.for 구문while 구문\-반복할 조건중, 초기화,증감문은 따로, 조건식만 괄호 안에 넣어준다.for문으로 쓸수있는거 while문으로도 다쓸수있고, while문으로 쓸수

문자열은 새로 할당하지않는한 값이 바뀌지않는다.index로 접근은 가능하지만 쓸 수는 없다.(read-only)\-연산자를 쓸수있음 (+만 가능 -는 불가능)string타입과 다른 타입 사이에 +연산자를 쓰면, string형식으로 변환(toString)typeof 로

자바스크립트에서 원시 타입의 데이터(primitive data types;원시자료형)는 객체가 아니면서 method를 가지지 않는 6가지의타입!string,number,bigint,boolean,undefined,symbol,(null)을 말한다.이중에서 자주 사용하는

배열에서의 주소값 동일 , 새로운배열선언/할당 뜻이 헷갈리기에 구분하려 써본다.위와 같이 push,pop,unshift,shift 메서드는 배열의 길이를 반환하고, 기존배열에 추가 혹은 제거되어서 arr을 다시 찍어보면 추가된채로 나온다. 이런경우 주소값동일 이라고한다

배열의 인덱스의 요소를 제거하거나 새로운요소를 추가하거나 제거하고 그자리에 추가하거나할수있는 메서드이다.Array.splice(index, 제거할요소개수,그자리에 추가할 요소) 로 쓸수있다.참고로 splice를 사용하면 주소값동일 로써 기존배열을 내용을 변경한다.가장

join메서드는 배열을 문자열로 바꾸어 새로운 문자열을 만들수있는 메서드이다.(주소값동일하지않음)split()메서드는 join과 반대로 문자열을 배열로 새로운배열을 만드는 메서드이다.(주소값동일하지않음)

notation은 dot notation , braket notation 두개가 있다. notation은 객체(obj)의 키or속성(property)의 값(value)을 구할때 쓴다.dot notationobj.property = value; <- 이런식으로 '.

배열에서 for of를 썻다면 객체에선 for in반복문으로 객체의 속성을 열거할수있다.Object.keys() 메서드로도 객체의 속성만 배열로 나열할수있다.for infor in을 쓸때는 for(let 속성(el) in 객체(obj)) 로 쓸수 있다.문제로 알아보자

자바스크립트에도 특별한 대우를 받는 일급 객체(first-class citizen)가 있다. 대표적인 일급 객체 중 하나가 함수이다.자바스크립트에서 함수는 아래와 같이 특별하게 취급된다.함수를 변수에 할당할 수 있기 때문에, 함수를 배열의 요소나 객체의 속성값으로 저장

고차함수(higher order function)는 함수를 인자(argument)로 받을 수 있고, 함수의 형태로 리턴할 수 있는 함수이다.함수는 변수에 저장할 수 있고, 함수는 함수를 담은 변수를 인자로 전달받을 수 있다.마찬가지로, 함수 내부에서 변수에 함수를 할당

자바스크립트에는 기본적으로 내장된 고차함수가 여럿 있다. 그중에서 배열 메소드들 중 일부가 대표적인 고차함수에 해당한다.배열 메소드 중 하나인 filter메소드에 대해 알아본다.배열의 filter메소드는, 모든 배열의 요소 중에서 특정 조건을 만족하는 요소를 걸러내는

map메소드는 콜백 함수를 각각의 요소에 대해 한번씩 순서대로 불러 그 함수의 반환값으로 새로운 배열을 만든다.콜백 함수는 배열 값이 들어있는 인덱스에 대해서만 호출된다. 즉, 값이 삭제되거나 아직 값이 할당/정의되지 않은 인덱스에 대해서는 호출되지않는다.map메소드는

reduce메소드는 호출하는 배열의 각각의 멤버에 대해서 콜백 함수를 실행하고 하나의 결과 값만 내보낸다. reduce메소드는 2가지 파라미터를 받는다. -> 리듀서(콜백)함수 , initialValue리듀서(콜백)함수는 4가지 파라미터를 받는다.\-> accumula

변수는 데이터를 표현하기 쉽고 언제든지 꺼내서 사용하거나 다른 데이터를 할당하기위해 사용한다.변수를 선언한다는 것은 데이터 보관함에 데이터를 넣을 공간을 확보하는 것을 의미한다.선언된 변수에 할당을 해보자!동시에 선언과 할당을 할 수 도있다.할당이 될때마다 sum의 값

조건문 기억해둬야할 6가지 falsy 값 논리연산자 AND OR 타입별 비교

string 타입과 다른 타입 사이에 + 연산자를 쓰면 string 형식으로 변환(toString)문자열의 길이를 알 수 있다.찾고자하는 문자열의 인덱스번호를 알 수 있다.찾고자하는 문자열이 존재하는지 여부 -> Boolean값 리턴!주로 문자열을 배열로 분리할 때 쓴

반복할 조건을 초기화, 조건식, 증감문 순으로 넣어준다.구구단을 출력할 수 있는 함수를 만들어본다.반복문을 넣어 구구단을 만들어준다.이중반복문을 사용하여 더 쉽게 만들어본다.

원시자료형에는 문자열, 숫자, 불린(boolean), undefined, null 등이 있고,참조자료형에는 배열, 객체, 함수(function)가 있다.\->값을 저장한다.저장공간 Stack에 저장됨.원시자료형은 모두 '하나'의 정보, 즉 데이터를 담고 있다.\-> 변

스코프는 '변수 접근 규칙에 따른 유효 범위'이다.안쪽 스코프에서 바깥쪽 스코프로는 접근 가능. 반면에 반대는 불가능\->바깥쪽에서 안쪽스코프로 접근은 불가능 ->스코프는 중첩이 가능하다.가장 바깥쪽의 스코프는 전역 스코프(Global Scope)라 부르고,전역이 아닌

블록 스코프(block scope)\-> 중괄호를 기준으로 범위가 구분된다.함수 스코프(function scope)\-> function 키워드가 등장하는 함수 선언식 및 함수 표현식은 함수 스코프를 만든다.주의할점 -> 화살표 함수는 블록스코프로 취급된다.(함수 스코

var로 선언된 전역 변수 및 전역 함수는 window 객체에 속하게 된다.\->때문에 전역 변수는 최소화해야함전역변수는 어디서든 접근 가능한 변수라서모든 변수를 전역변수로 만들면 편리하게 사용할 수 있다고 생각하겠지만, 너무 많은 수많은 다른 함수와 로직이 너도나도

매서드 호출은 객체.메서드() 와 같이 호출하는 방법을 의미한다.매서드 호출 방식을 이용할 때에는 화살표함수를 쓰지 않는다.\-> this 키워드를 쓸때 현재의 자신의 위치를 인지하지 못하기 때문에.위와 같은 객체가 있다.이 객체는 단 하나의 객체만 만들수 있다.만약

하나의 모델이 되는 청사진(blueprint)를 만들고,그 청사진을 바탕으로 한 객체(object)를 만드는 프로그래밍 패턴을 객체 지향 프로그래밍 이라고한다.여기서 하나의 모델이 되는 청사진을 -> class청사진을 바탕으로 한 객체 -> instance

객체 지향 프로그래밍이라는 패러다임이 등장하기 전엔절차 지향 프로그래밍이 있었다.우리는 앞서 모든 것을 절차적으로 생각하고 기껏해야 함수로 이동하는 것이 전부였다.\-> 초기의 C , 포트란 같은 언어들이 절차적 언어그러나 객체 지향 프로그래밍이 등장하면서, 단순히 변

프로토타입 이란? > javaScript는 프로토타입 기반 언어(prototype-based language)라 불린다. 모든 객체들이 메서드와 속성들을 상속 받기 위한 템플릿으로써 프로토타입 객체(prototype object)를 가진다는 의미이다. -> 정확히

이전에 고차함수매서드인 map, filter,forEach등 을 알아보았다.고차함수는 콜백함수를 사용하는 매서드로써 브라우저내에서 브라우저의 객체로 함수인 녀석들을 매서드라고 부른다.오늘은 그중 좀 까다로워보이는 reduce를 알아보자.mdn에 나와있는 설명으로는 이러

실행을 시키면 alert()함수를 썻기에 바로 입력창이 뜨며 id로 'hyo', password로 '0416'을 누르니 콘솔창에 'Hello Hyo님 반가워요'라고 잘 뜨는걸 확인할 수 있다.