윤태영블로그

현대 사회에서 사람들은 매일 많은 양의 데이터를 만들어 내고 있다.

이것들은 관련 회사들의 Data Base안에 저장된다.

Data Base란??

일정한 체계 속에 저장된 데이터의 집합을 의미한다.

데이터는 보통 데이터 베이스 안에서 Table이라는 단위로 저장된다. 

Table이라는 것은 우리말로 "표"라고 하는데 

위의 형태처럼, 1개의 Data base에는 여러 개의 테이블이 존재할 수 있는데, 

관련 있는 정보들을 하나의 테이블에 저장하고, 여러 테이블들을 두게 되면 많은 데이터 들을 체계적으로 저장할 수 있다.

데이터 베이스들을 여러 개 저장한다면, 아무리 방대한 데이터라도 마찬가지로 체계적으로 저장할 수 있다.

오늘날, 많은 기업들이 고객과 시장에 관한 데이터들을 모으기 위해 부단히 노력하고 있다

그 데이터 들은 모두 Data Base에 저장된다. Data Base에  저장된 데이터로 시장을 공략할 수 있기 때문에

SQL이 필요하다. 

출처: 코드잇

Object-oriented programming (줄여서 OOP)

문득 Javascript를 하다가 OOP가 자주 쓰이길 래, 무슨 말인지 몰라서 검색을 했다.

OOP는 프로그래밍을 한다는 사람이면 누구나 한 번쯤은 들어 봤으나, 추상적으로 다가 왔을 것이다.

Wikipedia에서 이렇게 설명하고 있지만, 쉽게 이해하지 못하는 사람도 더러 있을 것이다.(나 포함..)

객체 지향(객체 지향, 영어: object-oriented)은 소프트웨어 설계와 프로그램 기술에 사용되는 사고방식이다. 원래는 특정 프로그래밍 패러다임을 설명하기 위해 고안된 말이었다. object-oriented programming과 같이 수식어로서 사용되는 것이 보통이며, 그것 단독으로 취급되는 일은 없는 막연한 설계 구상이기도 하다.
참고: Wikipedia

나 머리 나쁜 것..확인...🤣

이해가 안되어서 인터넷을 좀 더 뒤져보았다.

듣자하니 객체 지향이 탄생하게 된 계기는  컴퓨터 프로그래밍 기술 및 컴퓨터 발전이 급속도로 진행되는 가운데 탄생되었다고 한다. 객체 지향 프로그래밍은 프로그래밍에서 필요한 데이터를 추상화(시스템, 모듈 등으로부터 "핵심적인 개념"을 간추려 내는 것) 시켜 그 데이터를 가진 객체 간의 상호작용을 일으키는 것이다. 

객체 지향의 구체적인 예로는 '자동차'로 이해할 수 있다.

자동차의 면허가 있는 사람이라면, 자동차의 기본적인 조작 방법은 알고 있고, 실제로 운전할 수 있을 것이다.(장롱면허 아닙니다.)

하나, 차의 면허를 가지고 있는 사람 전부가 차가 움직이는 구조를 알고 있는 것은 아닐 것..(그래도 운전이 되는 추상화 개념 갓갓.. 군대에 있을 때 운전병들은 제외..(진짜.. 차 내부 정비 핵 잘하더라구요...운전도 잘 하고..  운전병,부사관,장교님들 존경합니다.))

오히려 나처럼 자동차 구조와 같은 기계적 지식을 갖고 있지 않은 사람들이 더 많을 것이다.

이것은 무엇을 말하냐면, 자동차를 운전하는 데 차의 구조와 구조를 이해할 필요가 없다는 것이다. 몰라도 운전은 할 수 있다. 즉 자동차라고 하는 "물건"과, 차의 조작이라고 하는 "역할"을 나누어 생각하고 있는 것으로, 이 생각이 바로 OOP라고 할 수 있다.

객체 지향의 개념을 이해하기 위해서는 객체 지향과 관련된 의미를 파악하는 것이 중요하다.

클래스 : 프로그래밍은 설계도나 틀을 바탕으로 개발이 이루어지는 것으로, 이것은 객체 지향 프로그래밍에서도 동일하다.

무엇보다, 객체 지향의 프로그래밍에 사용하는 각각의 물건의 설계도를 클래스라고 한다.

클래스는 객체의 속성(데이터)과 메서드(동작, Activity)를 "정의"한다. <- 아직 설계도 일 뿐.

Object : "물건"이라는 의미이다. 프로그래밍에서는 데이터와 처리의 집합체라고 설명할 수 있다.

예를 들어, 야구 선수라는 오브젝트에는, 이름, 연령, 신장, 체중(속성)이라고 하는 데이터 외에

던지기, 달리기,라고 하는 처리(메서드)가 포함되어 있다.  즉, 객체에는 클래스에서 명사(속성) 외에도 동사(메서드) Activity에서 "정의" 한 것을 "구체화"한다. <-이렇게 생각하니 필자는 이해가 매우 쉬웠다.

캡슐화 : 객체의 상태를 외부에서 접근 못하게 막는 것.(일단 이정도로만 알고 캡슐화에 대한 세부 포스트 내용을 참고 하는 것이 좋다)

메서드: 메서드란, Object가 가지고 있는 처리를 말한다. 야구 선수라고 하는 오브젝트로 말하면, 

던진다, 잡는다, 친다, 달린다, 점프한다, 등 오브젝트가 "액션"을 일으키는 처리 다.

상속 : 객체 지향으로 개발된 물건에는 재이용하기 쉽다는 특징이 있다. 특히 클래스를 다른 제품 개발에

서 재사용하는 경우, 이를 "상속"이라고 한다.

다형성: 파트 마다 개발된 물건 은, 최종적으로는 각 파트가 연동하게 될 필요가 있다. 모든 파트가 하나의 지시로,

미리 정한 동작을 하는 구조를 만드는 것을 다형성이라고 한다. 어떤 하나의 변수명이나 함수명이 상황에 따라서 다르게 해석될 수 있는 것을 의미한다. 다형성은 어떤 한 가지 기능을 의미하는 것이 아니라 개념이기 때문에 여러 가지 방법으로 표현할 수 있다.

이 개념들은 필자가 각각의 개념들을 다시 알기 쉽게 정리해서 포스트 하였다. 중요한 개념이니 꼭 참고 해두었으면 한다!

객체 지향의 장점

1. 사용자 정의가 쉽고 유연한 대처가 가능하다.

객체 지향하에 프로그래밍을 하면 완성품에는 커스터마이즈가 쉬어진다는 장점이 있다. 사양 변경, 업데이트 등

유연하게 대응할 수 있는 것도 객체 지향의 큰 장점이라고 할 수 있다.

2. 작업자 간의 공유가 쉬워진다.

오브젝트 지향에 근거에 행해지는 개발에서는, 다수의 파트에 의해 구성되는 것을 세부에 이르기까지 작업자가

이해하면서 작업을 진행해 간다. 개별 작업자의 클래스에 대한 이해도가 높으면 작업자 간의 공유가 쉬워져

부드러운 작업으로 이어진다.

3. 재사용이 쉽고, 개발 작업의 효율화를 도모할 수 있다.

객체 지향으로 개발된 제품 또는 클래스는 재사용하기 쉽다는 장점이 있다. 이를 통해 기존 제품과 구조가

기본적으로 동일한 제품을 만드는 경우 개발 시간을 대폭 감소시킬 수 있다.

객체 지향의 단점

1. 이해하기 어렵다.

작업 방식이 아니라 개념인 객체 지향을 이해하는 것은 쉽지 않다. 이 점이 객체 지향의 가장 큰 단점이다.

2. 처음부터 개발할 때 코드가 복잡해지기 쉽다.

객체 지향에는 재사용이 쉽다는 장점이 있는 반면,  처음부터 개발하는 경우는 코드가 복잡해지기 쉽다는 단점도 있다.

따라서 재사용에 적합한 기성품이 없는 경우 많은 시간을 소비하게 된다. 

절차적 지향 프로그래밍(Procedural Programing)

개념: 절차적 지향 프로그래밍은 명령형 프로그래밍(Imperative Programing(컴퓨터가 수행할 명령들을 "순서대로" 써 놓은 것(예를 들어 요리법, 점검표 같은)))의 일종이다.

개발자 눈에는 보이지는 않는다.. 그래도 핵심은 순서대로 다!

탄생 시기 - 1950년대 중반 (우리 아빠 보다 나이가 많다.... 진짜 그때의 개발자분들은 대단하신 것 같다... 존경합니다..!)

대표적인 언어- C언어, COBOL, Perl이 있다.

절차적 지향 프로그래밍은 단순히 순서적인 명령 수행이 아니라 루틴, 서브루틴, 메서드, 함수 -> 프로시저를  이용한 프로그래밍 패러다임을 뜻한다. 즉 연속적인 계산 과정들을 포함하고 있다.

절차적 지향 프로그래밍은 프로시저를 이용해 코드의 재활용성이 높으며, 프로시저 콜을 통해 흐름을 쉽게 볼 수 있어서

코드의 가독성이 높아지며 "모듈화" 할 수도 있고 "구조화"를 할 수도 있다.

하지만, 단점으로는 인자를 "전달"하는 경우 적어도 인자의 개수만큼의 메모리 접근을 추가적으로 필요로 하고, 프로시저를 호출할 때 코드를 쓰는 것보다 시간이 매우 많이 소요된다.

                           -절차적 지향 프로그래밍 언어와 객체 지향 언어의 차이-

절차적 지향  프로그래밍 언어와 객체 지향 언어의 차이점을 간략하게 설명하자면
절차적 지향 프로그래밍 언어는 「심플하고 알기 쉬운 구조」의 반면, 객체 지향 언어는 「추상적이고 구조가 이미지 하기 어렵다」는 것이다. 절차적 지향  프로그래밍 언어는 프로그램을 실행해야 할 명령을 순서에 따라 기술해 가는 것으로 구성된다.  아래의 표는  정리한 표이다..! 

 

 

다음 글을 통해 객체 지향 프로그래밍에 대해 더 세부적으로 알아보자!!

자바스크립트의 객체란?
 
'값 또는 기능을 가지고 있는 데이터'이다.

이것을 자바스크립트엔 매우 당연한 일이라.
"자바스크립트의 모든 것이 다 객체다!"라는 말이 있을 정도로 모든 문법에 녹아 있다.

객체를 만드는 법을 알아볼까? 중요한 개념이니 가 보자구~😍

객체는 {}로 만들 수 있다. {} 안에는 여러 가지 다양한 값들을 , (쉼표)로 통해 저장할 수 있다.
{} 안에는 다양한 값들이 들어가기 위해 명확하게 하기 위해
이름을 정해줘야 한다.

{
 brandName: 'Taeyoungcoding',   
 bornYear: 1995,
 isVeryNice: true,
 worstCourse: null
}

위의 'Taeyoungcoding',1995, true, null 값들은 "Value"라고 부르고
값의 이름들은 "Key"라고 부른다.

키 1개의 값과 value 1개 값을 합친 것 ex) brandName: 'Taeyoungcoding'을
속성(Property)라고 하며, 속성 왼편을 Property Name, 오른편을 Property
Value라고 한다.

 -주의 사항-

1. Property Name을 지을 때는 첫 번째 글자는 반드시 문자, 밑줄(_), 달러 기호($) 중 하나로 시작한다.
2. 띄어쓰기 금지.
3. 하이픈(-) 금지.

"Web Browser"는 HTML 문서를 해석하고, 화면을 통해 해석된 결과를 보여주게 된다. 이걸 가능하게 하는 건 "Rendering"이라는 것이다.

브라우저를 통해 HTML 코드가 해석되고 어떤 식으로 화면을 보여줘야겠다 판단이 끝나면 나타나게 되는 것 => 렌더링

브라우저는 HTML 코드를 해석해서 요소들을 트리 형태로 구조화해 표현하는 문서(데이터)를 생성한다. 이를 DOM이라

하며, 브라우저는 DOM을 통해 화면에 웹 콘텐츠들을 렌더링 한다.

이해가 안 간다고..? 그럼 일상생활로 예를 들어서 이해를 시켜보겠다.. 저만 믿고 따라오시오!!

자... 예를 들어보자.. 음식을 만들어주는 회사가 있다고 머릿속에 그림을 한번 그려 보시겠는가..?

 "Web Browser"라는 음식을 만들어주고 제공하는 회사가 있다.(IT 회사 같지만 암튼 음식 회사임)

거기에는 Rendering이라는 엄청난 초 고급 기계가 있다.  그 기계는 도착한 음식 재료(코드 조각)들을 분석해서  HTML, CSS, Javascript 등으로 분류해서, 이건 저기 보내야겠군 이건 저기로 보내야겠군! 판단을 엄청 빨리 한 다음에.. HTML코드들은  DOM(Document object Model) 트리, CSS코드들은 CSSOM(CSS Object Model) 트리로!!  ,,.  하나의 (생산레일=트리) 같은 곳에 보내지게 된다.(생산직에서 알바 해보 신분이라면 더욱 쉽게 이해가 가실 듯하다.)
그렇게 두 개의 레일이 갈라지면서, 이제 하나의 레일로 합쳐지는 구간이 발생한다.   DOM 트리와 CSSOM트리의 두 개였던  레일이 하나의 레일로  합쳐지면서 결합이 된다! 그 구간을  "렌더 트리"라고 하겠다. 하나로 합쳐지면서 화면에 표시될 노드들과 스타일 정보들이 생겨났다. 즉 어엿한 음식이 되어버렸다.

이제 렌더트리를 통해 어엿한 음식이 만들어졌으니, 고객에게 음식을 제공.. 하기 전에!  각 음식들의 크기, 위치, 레이어 순서(layer order ex) 'z-index))등을 결정해서 음식을 제공할 위치를 결정하게 된다. 이걸 Layout이라고 하자!

이제 드디어 서빙을 통해 고객에게 음식이 제공된다. (Serving = 그리기(Painting)) 실제로 픽셀로 화면에 그린다. 이 과정에서 텍스트, 이미지, 배경색 등 시각적 요소가 화면에 표시된다.) 

이제 고객은 맛있게 볼 수 있게 된다..!!

밑의 사진은 레일에서 작업하는 것을 세부적으로 확인할 수 있다.

html이 body의 부모이고 body는 또 div의 부모이다.

 사진 출처 : 유노코딩

일상에서 글을 쓸 때는 .을 찍음으로써 그 문장이 끝났다는 걸 표현한다. (또 . 썼음 ..? < 또?  이렇게 자주 쓰인다..╰(*°▽°*)╯)

Javascript에서는  우리 언어의 "." 을 ";" 으로 대체한다고 생각하면 된다. (Javascript도, 표현 방법이 다를 뿐 하나의 언어라고 생각 해보자!)

console.log (10 + 3)
console.log (1 + 3)

이렇게 입력할 시, Javascript에서는 굳이 세미콜론(;)을 붙이지 않아도, 

값이 제대로 출력되지만

console.log (10 + 3) console.log (15 + 3)

위에 처럼, 입력 시  "Error"가 발생 한다. 

즉, 상황에 따라 자바스크립트가 알아서 세미콜론(;)을 추가해주지만,

문장 끝에  반드시 세미콜론(;)을 사용하는 습관을 가져 Error를 줄이는 것이 좋다.

내가 태어나기도 전의 웹사이트...👍 지금 봐도 깔끔하고 잘 만들어 졌다.

1991년 8월 6일 세계 최초의 웹사이트가 만들어지면서,

그 이후 초창기에 글 밖에 없었던 웹사이트들이 수많은 발전을 거듭하면서 웹사이트를 통해 이미지, 영상, 채팅 등 다양한 것들을 할 수 있게 된다.

여기서 가장 큰 기여를 한 것이 바로 'Javascript' 이다! (정말 Javacscript는 대단하지 않은가? 아직도 웹 개발자들에게는 필수적으로 쓰이고 있으면서, 역사의 전통까지 가지고 있다. 나 역시 Javascript를 너무 사랑한다.😍)

Javascript는 웹브라우저가 가진 기능을 실행시키거나 HTML/CSS를 통해 렌더링 된 화면을 조작할 수 있는 힘이 있는

웹사이트를 조작 할 수 있으면서도 기초적인 "나무의 뿌리"가 되는 강력한 언어이다.

즉, 웹사이트를 만들고 싶다면 반드시 배워야 하는'기초 언어'인 것이다...!!!!

기초 언어를 배울 때, 많이 하는 실수가 있는데 단순히 그 언어에 초점을 두고 문법만 학습한다는 것이다...

그렇게 되면 따라 하기 식이나 외우기 식 코딩이 되는 것이다.. 배운 걸 활용할 수 있는 상황이 올 때 멍하니 모니터만 쳐다보는 경우가 생기거나 , 많이 헤매거나 원리를 이해하지 못해 포기하게 될 수도 있다.

프로그래밍의 기본 개념을 이해하고 언어의 문법들을 활용하는 학습을 해야 다른 프로그래밍 언어를 접할 때 훨씬 수월하게 학습을 할 수 있고 응용하는 힘을 기를 수 있다.