Language8

• 자바스크립트(JavaScript) 자바스크립트는 동적이고, 약타입의 프로그래밍 언어입니다. 또한, 작성된 코드를 기계어로 변환하지 않고, 한 줄 단위로 해석해서 직접 실행하는 인터프리트 언어입니다. 크롬, 사파리와 같은 웹 브라우저에 띄우는 웹페이지에서 실행되거나, Node.js나 Apache와 같이 브라우저가 아닌 환경에서도 실행됩니다. 동적 언어(Dynamic programming language) 형(Type)과 값(Value) 모두 런타임에 변경될 수 있는 언어를 동적 언어라 합니다. 예를 들어, 이전에 정수형이 할당된 변수가 문장졀로 재할당될 수 있습니다. 언어를 읽고, 해석하는 인터프리터가 값을 통해 자료의 형을 추정합니다. 즉, 어떠한 변수의 타입을 결정하는 타입 체크(Type Check)가 런타임으로 이루어지는 것입니다. .. Language/JavaScript 2023. 3. 12.

• Input()과 Stdin.readline()의 차이 알고리즘 문제를 풀다보면 대다수의 문제가 데이터 입력을 요구합니다. 그래서 input 함수와 readline 함수는 알고리즘 문제를 파이썬으로 조금이라도 풀어본 사람이라면 익숙합니다. 저는 입력할 데이터가 많으면 readline 함수를, 함수 몇 개를 입력하는 거라면 글자수가 적은 input 함수를 써왔는데요. 그 차이가 왜 생기는지 알아보겠습니다. Input 실행시 파이썬 내부적으로는 readline이 호출됩니다. 프롬프트 인자가 있으면, 개행 없이 표준 출력에 작성됩니다. 입력 값에서 한 줄을 읽고, 문자열로 변환합니다. 이때 동반하는 개행은 제거합니다. 내장함수여서 따로 임포트가 필요 없습니다. Sys.stdin.readline 입력값을 이진 데이터로 받고, 문자열로 변환하지 않습니다. Input .. Language/Python 2023. 3. 6.

• 호이스팅(Hoisting) 호이스팅(hoisting)은 보통 '변수의 선언과 초기화를 분리하고, 선언만 코드의 최상단으로 올리는 것'으로 설명합니다. 그런데 JavaScript의 공식문서에 따르면 원래 JS의 호이스팅은 '인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당해두는 것'을 의미합니다. 그래서 변수가 아직 정의 되지도 않았는데 사용하는 코드가 있어도 문제 없이 실행 됩니다. var 키워드로 선언된 변수가 호이스팅에 의해 undefined로 초기화되어 참조가 가능한 것입니다. 호이스팅은 ES6 이전 기술 명세에는 따로 설명된 개념이 아니었습니다. ES6가 나오면서 var 키워드를 지양하고, const와 let 키워드를 사용하게 되었는데, 그러면서 JS의 달라진 동작 방식을 구분할 필요가 있었던 것이죠. var .. Language/JavaScript 2023. 3. 6.

• ScrollIntoView 함수로 탭 메뉴 스크롤 기능 구현하기 ScrollIntoView 메서드는 웹 페이지의 특정 요소로 스크롤할 수 있는 JavaScript의 내장 함수입니다. 이 기능을 사용하면 한 번의 클릭이나 탭만으로 특정 구역으로 쉽게 이동할 수 있습니다. 이번 포스트에서는 JavaScript와 React를 활용해서 Scroll 기능을 구현하는 방법을 소개하려고 합니다. 탭 메뉴를 클릭하면 해당 섹션으로 넘어가도록 만들어보겠습니다. 리액트가 없어도 ScrollIntoView 메서드는 사용할 수 있지만 예시로 든 코드에는 리액트가 활용된 점 참고해주세요. Step 1: 기본 틀 잡기 먼저 전체적인 틀을 잡아보겠습니다. 섹션 아이디를 미리 배열에 넣어두고, 이것을 헤더에 프라퍼티로 전달해서 스크롤 기능에 활용하도록 할거에요. 아직 작성하지는 않았지만 스크롤을.. Language/React 2023. 3. 2.

• [파이썬(Python)] 컴프리헨션(Comprehension) 파이썬의 컴프리헨션은 새로운 리스트, 셋, 딕셔너리와 같은 자료형을 간결하게 만들어주는 문법입니다. 보통 해당 자료형 내에 어떤 엘리먼트가 들어가는지 한 줄 안에 명시합니다. List Comprehension iterable한 오브젝트를 반복적으로 돌면서 새로운 리스트를 만듭니다. 이때 반복문의 요소들은 조건 내에서 식이 적용된 형태로 새 리스트에 저장됩니다. 문법 구조 [식 for 변수 in iterable한 객체 if 조건] even_numbers = [i for i in range(1, 21) if i % 2 == 0] 위 식을 살펴보면, even_numbers라는 새로운 리스트에, 주어진 조건을 만족하고, 식이 적용된 i가 엘리먼트로 삽입됩니다. 여기서 변수 i는 iterable한 객체 range.. Language/Python 2023. 3. 2.

• Node & Element (작성중) 노드 DOM을 구성하는 객체로, HTML 문서의 모든 것은 노드이다. 모든 노드는 서로 계층적 관계를 갖는다. 대표적인 노드의 종류 문서 노드(document node): HTML 문서 전체를 나타내는 노드 요소 노드(element node): 모든 HTML 요소는 요소 노드이고, 유일하게 속성 노드를 갖는다. 속성 노드(attribute node): 모든 HTML 요소의 속성은 속성 노드이고, 요소 노드에 대한 정보를 갖는다. 요소 노드의 자식 노드에는 포함되지 않는다. 텍스트 노드(text node): 텍스트를 갖는 노드이다. 주석 노드(comment node): 주석을 갖는 노드이다. 요소 (Elements/ 요소노드)` 노드의 일종 요소와 상호작용하는 특별한 프라퍼티나 메서드를 포함함 자바스크립트.. Language/JavaScript 2023. 2. 15.

• 전역 객체 Window & Document (작성중) 자바스크립트 = 호스트된 언어 브라우저가 자바스크립트 엔진을 제공해서 실행 환경을 제공함. 즉, 자바스크립트 파일을 분석하고 실행하게 해줌 브라우저는 Web API를 통해서 자바스크립트가 파싱된 문서와 상호작용할 수 있도록 함 전역 객체 document & window document Root DOM Node window: 브라우저 최상위 전역 객체 활성화된 브라우저 창이나 탭 전역 엔트리 포인트/ 저장소 브라우저가 제공하는 모든 기능에 접근 가능 Language/JavaScript 2023. 2. 15.

• Falsy / Truthy 다음 세 조건문은 동작할까요? // 1 if ('') {...} // 2 if (' ') {...} // 3 if ('anything') {...} 1번은 동작하지 않고, 2, 3번은 동작합니다. 왜 그럴까요? JavaScript가 빈 문자열 ''은 false로, 공백이 포함된 문자열 ' '과 문자열 'anything'을 true로 판별하였기 때문입니다. JavaScript에는 Falsy(거짓 같은 값)와 Truthy(참 같은 값)라는 문법 개념이 있습니다. Falsy와 Truthy는 JavaScript가 특정 값의 참/거짓을 판단할 때, 주어진 값이 Boolean 자료형이 아니거나, Boolean 비교가 불가능한 경우 true 또는 false로 변환되는 값을 뜻합니다. True 가 아닌데 JavaScr.. Language/JavaScript 2023. 1. 2.