전체 글 562

2-16 함수 표현식과 함수 선언문(Javascript)

함수 선언문 vs 함수 표현식 함수 선언문 1. 함수는 독자적인 구문 형태로 존재한다. 2. 선언문이 정의되기 전에도 호출할 수 있다. 전역 함수 선언문은 따라서 어느 위치에 있던 간에 사용이 가능하다. >> 자바스크립트의 내부 알고리즘 때문에 가능한 일이다. 자바스크립트는 스크립트 실행 전, 준비 단계에서 전역에 선언된 함수 선언문을 찾고, 해당 함수를 생성한다. 즉 스크립트 실행 전 초기화 단계에서 함수 선언 방식으로 정의한 함수가 이미 생성된다는 말이다. 3. 함수 선언문은 함수가 선언된 코드 블럭{} 안에서만 유효하다. 함수 표현식 1. 표현식이나 구문 구성 내부에 생성된다. 할당연산자 =를 이용해서 만든다. 2. 실제 실행 흐름이 해당 함수에 도달 했을 때 함수를 생성한다. 그래서 그 구문에 실..

함수 (Javascript)

함수 매개변수 Function message(from, text='no text given'){ alert(from + ":" + text); } Message("ann") >>만약 text 매개변수에 값이 전달되지 않았을 경우에는 Undefined가 전달된다. 그러나 위 코드 같은 경우에는 값이 할당되지 않았을 때 no text given이라는 값이 Undefined 대신 할당된다. 함수 선언할 때 기본값을 따로 설정해두는 방법도 있지만, If문을 이용해서 함수 내에서 설정해주는 방법도 있다. Function message(text){ if (text==undefined){ text='Hello'; } } 아니면 논리연산자 ||를 이용하는 방법도 있다. Function message(text){ tex..

[VSCode] Extensions 추가하기

extension은 vscode 이용시 생산성을 높여준다. 1. Material theme >> VSCode 색상 변경시 사용 2. Material Icon Theme 아이콘을 좀 더 직관적으로 알 수 있게끔 해준다. 3. Prettier - Code formatter 코드를 자동으로 변환해준다. Ctrl + , : setting으로 이동 동그라미 친 부분 체크하기 동그라미 친 부분 체크하기2 >> 문자열 입력시 작은 따옴표 사용 설정 4. Bracket Pair Colozier : 괄호마다 색깔이 달라서 코드의 가독성을 높여준다 5. Indent-rainbow 들여쓰기에 색깔이 입혀지면서 가독성이 높아진다 6. Auto rename tag 앞에 태그를 수정하면 뒤에 태그도 자동으로 수정되게 해준다. 7..

2-13 while과 for 반복문

do... while 반복문 do { //본문 } while(condition); 조건이 truthy지 아닌지 상관없이, 본문을 최소 한 번 이상 실행해야 할 때 사용한다. 근데 대다수의 상황에선 while() {}가 적합하게 사용되는 중! 반복문 빠져나오기 Break let sum=0 while (true){ let value=+prompt("숫자를 입력하세요",''); if (!value) break; sum+=value; } alert('합계:' + sum); if (!value) break; >> 사용자가 아무것도 입력하지 거나, cancel버튼을 눌렀을 때 활성화된다. 반복문이 즉시 중단되고 alert가 실행됌 다음 반복으로 넘어가기 Continue : 현재 실행 중인 이터레이션을 멈추고 다음 ..

카테고리 없음 2021.03.09

[Github] README.md 파일 문법 정리하기

# Heading1 ## Heading2 ### Heading3 #### Heading4 ##### Heading5 ###### Heading6 Paragraph ___ **bold** *italic* ~~strikethrought~~ > Don't forget to code your dream. * 🍒 * 🍎 * 🍅 * 🍊 * 🍋 * 🥝 Other fruits : - 🍓 Numbers: 1. first 2. second 3. third Click [here](https://www.tistory.com/) ![image desciption](url주소) ![image description](https://user-images.githubusercontent.com/61736137/102153953-b28..

2-9 비교 연산자 (Javascript)

자바스크립트의 문자열 비교 알고리즘은 유니코드순이다. 대문자 A와 소문자 a 비교 시, a의 값이 더 크다. 일치 연산자 동등연산자 ==은 0과 false를 구별하지 못한다. 왜냐면 자료형의 동등 여부까지 검사할 수 없기 때문이다. alert(' '==false); // true 일치 연산자 ===를 사용하면, 형변환 없이 값 비교 가능하다. 일치 연산자는 엄격한 동등 연산자이다. 자료형의 동등 여부까지 검사한다. alert(0===false); // false 마찬가지로 !==는 부등 연산자 !=의 엄격한 형태이다. !==는 불일치 연산자 alert(null===undefined) // false alert(null==undefined) // true >> 동등 연산자는 null과 undefined를 ..

2-8 기본 연산자와 수학 (Javascript)

피연산자 : 인수라는 용어로 불리기도 한다. 5 * 2 이면, 5와 2가 피연산자 1. 단항 연산자 : 피연산자를 하나만 받는 연산자이다. EX) let a=1 a=-a >> 단항 마이너스 연산자(-) 2. 이항 연산자 : 두 개의 피 연산자를 받는 연산자 거듭제곱 연산자 ** >> alert(2**3) //8 3. 이항 연산자 +로 문자열 연결하기 ※ 주의 ※ 피연산자 중 하나가 문자열이면 다른 하나도 문자열로 자동변환! ex) alert(2+2+'1') //41 4. 단항연산자 +와 숫자형으로의 변환 단항 연산자의 피연산자가 숫자가 아닌 경우, 숫자형으로 변환이 일어난다. 연산자 우선순위 단항 연산자의 우선순위 >> 이항 연산자의 우선순위 할당 연산자 =는 연산자이기 때문에 흥미로운 함축성을 내포하고..

2-7 형변환 (Javascript)

형변환(type conversion)이란? : 함수와 연산자에 전달되는 값은 대부분 적절한 자료형으로 자동 변환 되는데 이 과정을 의미한다. 형변환 예시 alert가 전달받은 값의 자료형과 관계없이, 이를 문자형으로 자동 변환하는 것 - 명시적 형변환 >> 코드에 직접 변환 될 자료형을 입력해야 하는 것 EX) long a=1 int b= (int) a >> (int)를 붙여줌으로써 int형으로 변환이 된다. 만약 a의 값이 int 타입의 범위를 벗어나게 되면, 오버플로우가 발생한다. 암시적 형변환 >> 변환 될 자료형을 입력하지 않아도 되는 형변환이다. 작은 범위의 자료형에서 넓은 범위의 자료형으로 변환할 때 일어난다. int 타입이 -> long 타입으로 변환 1. 문자형으로 변환 : 문자형의 값이 ..

2-6 alert, prompt,confirm을 이용한 상호작용 (Javascript)

alert 함수 > 사용자가 확인 버튼을 누를때까지 메세지를 보여주게끔 하는 함수 - 모달 창 : 메세지가 있는 작은 창을 의미한다. 모달이라는 단어엔 페이지의 나머지 부분과 상호 작용이 불가능하다는 의미가 내포되어 있다. 즉, 확인 버튼을 누르기 전까진 모달 창 밖에 있는 버튼을 누를 수 없다. prompt 함수 > 함수가 실행되면 텍스트 메세지와 입력 필드, 확인 및 취소 버튼이 있는 모달창을 띄워준다. result = prompt(title,[default]); title : 사용자에게 보여줄 문자열 default : 입력 필드의 초깃값(선택값) ※ IE 에서는 항상 기본값을 넣어줘야 한다. let test= prompt("Test",''); confirm 함수 (컨펌 대화상자) result = c..

2-5 자료형 (Javascript)

동적 타입 언어 : 자료의 타입은 있지만 변수에 저장되는 값의 타입은 언제든지 바꿀 수 있는 언어이다. EX) let apple='hello' apple=123 >> 주의할 점 : 변수의 선언은 한 번만 할 수 있음 1. 숫자형 (Number Type) : 정수 및 부동 소수점 숫자를 나타낸다. - Infinity : 무한대를 나타낸다. 어떤 숫자든 0으로 나누면 무한대를 얻을 수 있다. alert(1/0) or alert(Infinity) - NaN : 계산 중에 에러가 발생했다는 것을 알려준다. 부정확한 수학 연산을 사용했다는 뜻이다. 예를 들면 문자열을 숫자로 나누려고 했다던가 그런 말도 안되는 연산들! - BigInt형 : 길이에 상관 없이 나타낼 수 있는 자료형으로, 표준으로 채택된 지 얼마 안..

2-4 변수와 상수, 함수형 프로그래밍 (Javascript)

변수 Variable : 데이터를 저장할 때 쓰이는 '이름이 붙은 저장소' 자바 스크립트에서는 let 키워드를 이용해서 변수를 생성한다. let apple; apple='Hello' (let apple='Hello') >> 문자열 'Hello'를 변수 apple에 저장한다. let apple='Hello',age=25,message='World!' >> 이런식으로 한 줄에 입력할 수도 있지만, 가독성 떨어짐 var : let과 거의 동일하게 동작함 let의 구버전이라고 할 수 있음 함수형 프로그래밍 : 불변성을 지향하는 프로그래밍 언어 패러다임으로, 변경 가능한 상태를 최대한 제거하기 위해 노력하는 언어이다. 순수 함수를 지향한다. 순수함수를 통해 부수 효과를 줄이면서 프로그래밍 하는 것을 의미함 스칼라..

[인프런 대학생 리프 2기] 오리엔테이션 생생한 후기!

기간은 21.3.8 ~ 21.4.24주 동안 인프런 대학생 리프 2기로 활동을 하게 되었어요 :) 제가 요새 인프런에서 듣고 싶은 강의가 있어서,거의 매일 들어가다시피 하다가 발견한 리프 2기 공고글!!두둥,, 운명인가,, 고민 없이 바로 지원했습니다 ㅎㅎ 일단 인프런 리프 자격 조건은 인프런을 사랑하는 대학생, SNS를 활발히 사용하는 대학생이면 ok!** 심지어 휴학생까지 가능해요 ** 저는 주로 티스토리에서 활발하게 운영을 하고 있기 때문에,요기다가 앞으로 포스팅을 쭉 해보려고 합니다! 이번 인프런 2기 활동에서는!파이썬 입문 강의, 파이썬 중고급 강의, 피그마 입문 이렇게 3가지 코스로 나누어 인원을 선별했어요! 저는 파이썬 중고급 강의를앞으로 한 달 동안 수강 할 예정이에요! >> 바로 제가 한..

2-2 코드 구조

세미콜론으로 서로 다른 문을 구분한다. alert('hello'); alert('world!'); OR alert('hello') alert('world!') >> 이런식으로 줄 바꿈이 있다면 세미콜론 생략도 가능! 하지만 예외상황이 발생할 수 있어서 세미콜론을 써주기! 대괄호 [] 앞에서는 세미콜론이 있다고 가정하지 않아서,, 이런 경우에는 오류가 발생한다. 주석 1. 한 줄 주석 // 2. 여러 줄 주석 /* */ 주석 처리 단축키 한 줄 주석 : Ctrl + / 여러 줄 주석 : Ctrl + Shift + / ※ 주의사항 ※ 중첩 주석은 지원하지 않음!!

2-1 Hello World! // script 태그

자바스크립트 코드는 >> src 속성이 지정되어 있으면, 태그 내부의 코드는 싸그리 무시! HTML 안에 직접 스크립트를 작성하는 방식은, 스크립트가 아주 간단할 때만 사용한다. 스크립트가 길어지면 별도의 파일로 만들어 저장하는 것이 좋다. 별도의 파일에 작성하면 이점은? >> 브라우저가 스크립트를 다운 받아서 캐시에 저장하기 때문에, 성능상의 이점이 있다. 캐싱 : 컴퓨터의 처리 성능을 높이기 위한 기법이다. 캐시 메모리 : CPU와 메모리의 속도 차이로 인한 병목 현상을 완화하기 위해 사용한다. 자주 사용하는 데이터를 CPU와 가까운 위치에 저장해 필요할 때 마다 빠르게 꺼내쓸 수 있다. 캐시 메모리를 사용하게 되면, CPU가 메모리에 접근하는 횟수를 줄여 성능 향상 효과를 볼 수 있다. CPU가 데..

1-3 개발자 콘솔

개발자 도구를 이용하면 에러를 확인할 수 있다. 스크립트에 대한 쓸만한 정보도 얻을 수 다. 개발자 도구에서 지원하는 기능을 잘 활용하면, 개발 효율이 상당히 올라간다. bug.html은 해당 에러가 발생한 파일, 12는 에러가 발생한 줄 > 이거는 자바 스크립트 명령어를 입력할 수 있다. 이를 커맨드 라인이라고 부른다. 명령어를 여러 줄에 걸쳐 작성하고 싶다면 Shift + Enter를 누르면 된다. 그러면 명령어 실행하지 않고 줄바꿈만 할 수 있다.

1-2 매뉴얼과 명세서 (Javascript)

www.ecma-international.org/publications-and-standards/standards/ecma-262/ ECMA-262 - Ecma International ECMAScript® 2020 language specification, 11th edition - ECMAScript is a programming language based on several technologies like JavaScript and JScript. www.ecma-international.org >> 자바스크립트와 관련된 상세한 정보를 담고 있는 공식 문서 검색 방법 구글 검색엔진에다가 MDN [원하는 용어] 라고 검색 EX) MDN + parseInt EX) ‘RegExp MSDN’, ‘RegEx..

1- 1 자바 스크립트(JavaScript)란?

JavaScript 자바스크립트는 웹페이지에 동적인 효과를 주기 위해 만들어진 프로그램이다. 자바스크립트로 작성한 프로그램이 스크립트이다. 웹사이트가 로딩된 이후에 CSS와 HTML 구성 요소들을 변경할 수 있게 해주고, 이를 통해 웹 페이지를 인터랙티브 하게 만들고, 사용자의 참여도도 높일 수 있다. 자바 스크립트의 장점 - HTML/CSS와 완전히 통합할 수 있다. - 간단한 일은 간단하게 처리할 수 있게 해준다. - 모든 주요 브라우저에서 지원하고, 기본 언어로 사용된다. 이 세 가지를 모두 지원하는 브라우저 연관 기술은 JS뿐이다. 이를 이용해서 서버나 모바일 앱도 만들 수 있다. - 자바 스크립트 너머의 언어들 - 자바스크립트로 트랜스파일이 가능한 언어 1. Coffee Script : 짧은 문..

[Chapter8] 다이나믹 프로그래밍

참고 출처 : 이것이 코딩테스트다 with 파이썬 다이나믹 프로그래밍 : 동적 계획법 피보나치 수열은 재귀함수로도 구현이 가능하지만, 숫자가 커질수록 연산수가 늘어남.. 그래서 피보나치 수열은 보통 다이나믹 프로그래밍을 사용해서 구현함. 항상 다이나믹 프로그래밍을 사용할 수 있는 것은 아니다. 다음 조건을 만족할 때만 다이나믹 프로그래밍을 사용할 수 있다. 1. 큰 문제를 작은 문제로 나눌 수 있다. 2. 작은 문제에서 구한 정답은 그것을 포함하는 큰 문제에서도 동일하다. 피보나치 수열을 메모이제이션 기법을 사용해서 해결하기 (메모이제이션은 다이나믹 프로그래밍 구현 방법 중 하나이다.) => 메모이제이션 기법은, 한 번 구한 결과를 메모리 공간에 메모해두고 같은 식을 다시 호출하면 메모한 결과를 그대로 ..

[이진 탐색] Chapter7 부품 찾기 & 떡볶이 떡 만들기

참고 출처 : 이것이 코딩테스트다 with 파이썬 # 부품 찾기 [이진탐색] : 재귀함수 이용할 것 1. 함수 인자에 리스트, 타겟, 0 (초기 start값), n-1 (end값)을 매개변수로 넘겨준다. 2. def function 함수 - start 값이 end보다 크면, None 값을 반환 - 만약 리스트[mid] 값이 target이랑 값이 같으면 mid를 반환한다. - 만약 ... 크다면 function(리스트, 타켓, start, mid-1) => end 값이 mid-1로 변경 - 만약 ... 작다면 start 값이 mid+1로 변경 책 답지 #떡볶이 떡 만들기 => 이진 탐색 문제이자, 파라메트릭 서치 유형의 문제 파라메트릭 서치는 최적화 문제를 결정 문제로 바꾸어 해결하는 기법이다. 원하는 조..

[파이썬] 여러 개의 버튼을 각자 작동하게 하는 법 (Qt designer로 UI 구현)

동기함수로 작성되어 있는 경우, 위에서부터 차례대로 함수를 수행한다. 예를 들어, 실행하기 버튼을 누르면 실행하기 버튼에 해당되어 있는 함수가 끝나기 전까진 어떠한 버튼도 눌리지 않는다. 그래서 나는 실행하기 버튼을 누른 상태에서 종료하기 버튼을 눌러 상태를 바꿔보려고 한다. 처음엔 비동기함수로 작성하려 했으나 Qt designer로 파이썬 ui를 구현해서,, 좀 어렵게 됐다.. (변명이라면 변명이겠지만,, 아직 방법을 잘 모름..) 1. def __init__ () 함수에 stop_button 변수 (bool 타입)를 선언해준다. 값은 False 2. 실행하기 메서드 (Thread 이용) 위 함수 execute1은 Thread를 정의해둔 함수! 즉 execute 함수가 진또배기라는 거! 위 함수는 그냥..

[#5] 이진 탐색 chapter7

순차 탐색>> 리스트 안에 있는 특정한 데이터를 찾기 위해 앞에서부터 데이터를 하나씩 차례대로 확인 >> 최악의 경우 시간 복잡도 O(N) 이진 탐색 >> 반으로 쪼개면서 탐색하기 >> 찾으려는 데이터와 중간점 위치에 있는 데이터를 반복적으로 비교해서 원하는 데이터 찾기 이진 탐색은 원소의 개수가 절반씩 줄어든다 따라서 시간 복잡도는 O(logN) 이진탐색 구현 방법은 재귀함수 이용, 반복문 이용 처리해야할 데이터의 개수나 값이 1000만 단위 이상이면, 이진 탐색과 같이 O(logN)의 속도를 내는 알고리즘을 떠올려야함 문제에 자주 나오니 외우길 권장 트리 자료구조>> 큰 데이터를 처리하는 소프트웨어는 대부분 데이터를 트리 자료구조로 저장해서 이진 탐색과 같은 탐색 기법을 이용해 빠르게 탐색 가능 이진..

[파이썬] 람다 lambda 함수

람다는 함수를 딱 한 줄만으로 만들게 해준다. lambda 인자 : 표현식 def hap(x,y): return x+y hap(10,20) >> 이 함수를 람다로 표현하면, (lambda x,y:x+y)(10,20) map() map(함수,리스트) >> 리스트로부터 원소를 하나씩 꺼내서 함수를 적용시키고, 그 결과를 새로운 리스트에 담는다. map(lambda x:x**2,range(5)) >> [0,1,4,9,16] range(5)는 [0,1,2,3,4]라는 리스트를 돌려준다. ex) a=[1,2,3,4] b=[1,2,3,4] list(map(lambda x,y:x+y,a,b))

[#4] 정렬 (chapter6)

참고 출처 : 이것이 코딩테스트다 with 파이썬 1. 기준에 따라 데이터를 정렬 정렬이란? 데이터를 특정한 기준에 따라서 순서대로 나열하는 것을 의미한다. 면접에서 단골문제로 자주 등장한다. 리스트를 뒤집는 연산은 O(N)의 복잡도로 간단히 수행할 수 있다. 정렬은 이진탐색의 전처리과정이다. 정렬 종류 : 선택 정렬, 삽입 정렬, 퀵 정렬, 계수 정렬 (1) 선택 정렬 : 매번 가장 작은 것을 선택한다는 의미. 가장 작은 것을 선택해서 앞으로 보내는 과정을 반복해서 수행하다 보면, 전체 데이터의 정렬이 이루어진다. 스와프? 특정한 리스트가 주어졌을 때 두 변수의 위치를 변경하는 작업이다. 선택정렬의 시간복잡도는 O(N^2) #2중 반복문이 사용되었기 때문 (2) 삽입 정렬 : 특정한 데이터를 적절한 위..

[#3] DFS/BFS

스택 (후입선출) append() // pop() 큐 (선입선출) 파이썬을 큐 규현 시 collections 모듈에서 제공하는 deque 자료구조 활용 queue 라이브러리보다 효율적이다. 재귀함수 : 자기 자신을 다시 호출하는 함수. 파이썬에서는 무한대로 재귀 호출 진행 불가 재귀함수는 수학 시간에 한 번씩 언급되는 프랙털 구조와 비슷하다. 재귀함수에서는 종료 조건을 꼭 명시해야 한다. 스택 구조를 활용해야하는 경우 재귀함수를 이용해서 간편하게 대부분 구현이 가능하다. 팩토리얼이 재귀 함수의 대표적인 예시문제 n이 0이거나 1일 때 값은 1 2부터는 n*factorial(n-1) 탐색 알고리즘 DFS/BFS DFS : 깊이 우선 탐색(Depth-first search), 그래프에서 깊은 부분을 우선적으..