[데이터_공예소]

비동기 처리와 콜백 함수 콜백에 관하여 검색하면 항상 비동기 처리라는 말과 같이 나오는 것을 볼 수 있다. 그 이유는 바로 콜백함수를 쓰는 이유가 비동기 처리를 위해서 사용하기 때문이다. 1. 비동기처리 자바스크립트의 비동기처리란 특정 코드가 종료되지 않은 상태라 하더라도 대기하지 않고 다음 코드를 실행하는 자바스크립트의 특성 (병렬적 실행)을 의미한다. 자바스크립트에서 비동기처리가 필요한 이유 화면에서 서버로 데이터를 요청했을 때 서버가 언제 그 요청에 대한 응답을 할지도 모르는 상태에서 다른 코드를 실행 안하고 기다릴 수는 없기 때문이다. 주의: jQuery의 사용: 코드에서 $.get 함수를 사용하고 있는데, 이는 jQuery 라이브러리의 일부이다. 따라서 이 코드를 브라우저 환경에서 실행하려면 j..

1. 태그 선택하기 - $('selector') const h1Elem1 = document.querySelector('h1');// JavaScript로 태그 선택 const h1Elem2 = $('h1'); // jQuery로 태그 선택 h1Elem1 === h1Elem2 jQuery에서는 $('selecto')로 선택자를 지정할 수 있다. 2. 태그 속성과 HTML 값을 확인하고 변경하기 attr() - 태그 속성의 값을 가져오고 변경하기 attr() 사용방법 $('selector').attr('태그의 속성 key명', '세팅할 value') attr()를 이용해서 값 가져오기 $('div1').attr('style') attr()를 이용해서 값 변경하기 $('div1').attr('style', ..

Closure (클로저) 함수가 자신이 선언됐을 때의 환경인 스코프를 기억하여 자신이 선언됐을 때의 환경 밖에서 호출되어도 그 환경에 접근할 수 있는 함수를 뜻한다. (함수가 실행되는 위치가 어디인지는 관계가 없다. ) 렉시컬 스코프 스코프는 함수를 호출할 때가 아니라 함수를 어디에 선언하였는지에 따라 결정이 된다. 이를 렉시컬 스코핑이라고 한다. var x = 1; function foo() { var x = 10; bar(); } function bar() { console.log(x); } foo(); // 1 bar(); // 1 언뜻보면 foo에서 실행이 되어 x가 foo 내부의 x를 가리킬 것 같지만 실제 bar가 선언됐을 당시의 x인 1을 가리키게 된다. 이처럼 렉시컬 스코프는 함수를 어디서..

JavaScript는 원시 타입과 참조 타입이라는 두가지 자료형을 제공하며 Object를 제외한 모든것들은 Primitive한 성격을 갖고 있다. Primitive Type : 데이터의 실제 값 할당 Reference Type : 데이터의 위치 값만 할당 1. Primitive Type (원시타입) 원시 타입의 데이터는 변수에 할당이 될 때 메모리 상에 고정된 크기로 저장이 되고 해당 변수가 원시 데이터 값을 보관한다. 원시 타입 자료형은 모두 변수 선언, 초기화, 할당 시 값이 저장된 메모리 영역에 직접적으로 접근한다. 즉, 변수에 새 값이 할당이 될 경우, 변수에 할당된 메모리 블럭에 저장된 값을 바로 변경한다. 1.1 Primitive Type의 종류 Boolean number String null..

호이스팅 (Hoisting) 사전적 정의 : 끌어 올리기 JavaScript에서의 Hoisting : 변수의 정의가 그 범위에 따라 선언과 할당으로 분리되는 것을 의미한다. 즉, 변수가 함수 내에서 정의되었을 경우, 선언부분만 함수의 최상위로, 함수 바깥에서 정의되었을 경우, 전역 컨텍스트의 최상위로 변경이 된다. console.log(a);// Reference Error 선언되지 않은 변수를 참조할 경우, 보통 이렇게 오류가 나타난다. console.log(a);// undefined var a = 1; console.log(a);// 1 하지만 위의 예제에는 오류가 나타나지 않는다. 선언되지 않은 변수를 참조하는데 오류가 나지 않고 undefined로 값이 지정된 이유는 바로 Hoisting 때문이..

스코프 (유효범위) Scope의 정의 📋 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유효범위 자바스크립트 엔진이 식별자를 검색할 때 사용하는 규칙 Scope의 구분 ⚖️ 자바스크립트에서 스코프는 변수와 함수의 유효 범위를 나타냅니다. 스코프는 변수와 함수가 어디에서 접근 가능한지를 결정합니다. 스코프는 전역 스코프(Global Scope)와 지역 스코프(Local Scope)로 나뉩니다. 전역 스코프(Global Scope): 전역 스코프는 코드 어디에서나 접근 가능한 스코프입니다. 전역 스코프에서 선언된 변수와 함수는 프로그램의 어느 곳에서나 접근할 수 있습니다. var globalVariable = 10; function globalFunction() { console.lo..

jQuery 소개 jQuery는 자바스크립트 라이브러리로 Javascript 프로그래밍을 크게 단순화합니다. HTML/DOM 조작, CSS 조작, 이벤트, 효과 및 애니메이션, Ajax등의 기능이 포함되어 있습니다. jQuery 연결하기 jQuery를 연결하는 방법에는 두 가지가 있습니다. 1. 다운로드 받기 html의 2. CDN 이용 html의 jQuery 구문 jQuery의 기본 형식입니다. $(selector).action();// $(선택자).동작함수() $(document).ready() 안에 jQuery 함수를 입력합니다. → 문서가 완전히 로드되고 나서 jQuery를 실행합니다. $(document).ready(function(){ // jQuery methods go here... });..

ECMA스크립트란, ECMA International이 ECMA-262 기술 규격에 따라 정의하고 있는 표준화된 스크립트 프로그래밍 언어를 말합니다. 2009년에 발표된 ES(ECMAScript 5)는 웹 어플리케이션 부터 소셜게임 까지 다양한 곳에서 활용이 되었습니다. 그 이후, 기존에 자바스크립트의 여러 문제점을 해결하고 개선한 ES6(ECMAScript 2015)이 2015년 여름에 발표 되었습니다. ES6은 ECMAScript 2015라도고 불리고, 기존 여러 기능을 개선한 버전입니다. ES6의 핵심 기능 중 하나는 ES5(ECMAScript 5) 버전을 기반으로 개발된 웹 페이지가 동작가능 하도록 하위 호환성을 지원하는 것입니다. ES6에 추가된 주요 기능은 아래와 같습니다. let & cont..

테이블과 뷰 Workbench에서 테이블 생성 테이블을 생성할 때 제약 조건(Constraint) 을 잘 적용하여 만들어보자! For 무결성 -- 1. DB가 존재하면 삭제하기 DROP DATABASE IF EXISTS ShopDB; DROP DATABASE IF EXISTS ModelDB; DROP DATABASE IF EXISTS sqldb; DROP DATABASE IF EXISTS tabledb; -- 2. DB 만들기 CREATE DATABASE tabledb; -- 3. tabledb에 buytbl 만들기 CREATE TABLE `tabledb`.`buytbl` ( `num` INT NOT NULL AUTO_INCREMENT, `userid` CHAR(8) NOT NULL, `prodName`..

MySQL에서의 Primary Key와 Foreign Key Primary Key (기본 키) 정의: 테이블 내의 각 행을 고유하게 식별하는 데 사용되는 하나 또는 여러 개의 컬럼(열)의 집합입니다. 특징: 테이블당 하나만 존재할 수 있습니다. 중복된 값을 가질 수 없으며 NULL 값을 허용하지 않습니다. 보통 ID나 번호로 사용되며, 자동으로 증가하는 값을 설정할 수 있습니다 (AUTO_INCREMENT). Foreign Key (외래 키) 정의: 다른 테이블의 기본 키를 참조하는 컬럼(또는 컬럼 집합)입니다. 목적: 두 테이블 간의 관계를 설정하고 데이터 무결성을 유지하는 데 사용됩니다. 특징: 참조하는 테이블의 기본 키에 존재하지 않는 값을 가질 수 없습니다. NULL 값이 허용될 수 있으며, 하나..