2.4 자바스크립트와 ECMA스크립트

  • ECMA스크립트 == 자바스크립트 표준사양 ECMA-262
  • 값, 타입, 객체와 프로퍼티, 함수, 표준 빌트인 객체등의 핵심문법을 규정하고 브라우저 제조사는 해당 사양을 준수하여 내장 자바스크립트 엔진을 구현한다.
  • 자바 스크립트는 표준 ECMAscript를 포함해 web API등을 아우르는 개념이다.
  • web API는 W3C world wideweb consortium 에서 별도 사양으로 관리중이며 MDN web docs에서 확인이 가능하다.

2.5 자바스크립트의 특징

기존 프로그래밍언어의 영향을 받았다.

  • 기본문법은 C, JAVA
  • 프로토타입 기반 상속은 Self
  • 일급함수 개념은 Scheme

명령형, 함수형, 프로토타입기반 객체지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어다.

3.1 자바스크립트 실행환경

  • ECMAscript를 교집합으로, 클라이언트 사이드의 API를 포함하고 있는 브라우저 실행환경과, 서버사이드 API를 포함하고 있는 Node.js 환경이 있다.
  • 예컨대, Node에서는 파일을 생성, 수정할 수 있는 파일 시스템을 기본으로 제공하지만 클라이언트 사이드에서는 지원하지 않는다. 브라우저로 로컬파일에 접근해 수정과 삭제가 가능한건 오싹한 일이다. 역시 Node환경에서도 Dom API등을 쓸 일이 없기 때문에 지원하지 않는다.

3.1+ 개발자 도구의 기능

Elements : DOM+CSS -> 렌더링 된 뷰를 확인할 수 있다
Console : 에러를 확인하고 console.log() 메소드내역을 확인할수있다
Sources : 브레이킹 포인트를 잡고 디버깅을 돕는다
Network : 로딩된 페이지에 관련된 네트워크 요청과 정보, 성능을 확인할 수 있다
Application : 웹 스토리지, 세션, 쿠키 확인과 관리가 가능하다

3.3 Node.js

프로젝트 규모가 커짐에 따라 React, Angular등의 프레임워크나 라이브러리를 도입하게 되면서, Babel, webpack, EsLint등의 도구 사용또한 필요해졌다. 이때 Node.js와 npm이 필요하다.

  • npm: node package manager
  • node.js에서 사용가능한 모듈을 패키지화해서 모아둔 저장소이며, 패키지의 설치와 관리를 위한 CLI를 제공한다.

4.1 변수란 무엇이고 왜 필요한가?

어플리케이션은 데이터를 다루며 결국 입력과 출력의 연속이라고 볼 수 있다. 변수는 프로그래밍 언어에서 데이터를 관리하기 위한 핵심 개념이다.

10+20

이라는 식을 계산하려면?

  • 각 기호의 의미를 알고 있어야한다. ('10','+','20')
  • 식의 의미를 해석 가능한가 (덧셈식이라는 것)
  • 해석 후의 계산 결과를 기억할수 있는가 (10+20은 30이다.)

마찬가지로 코드를 계산(평가 evaluction)하려면

  • 리터럴과 연산자를 알고 있어야 한다
  • 표현식 expression의 의미를 해석 parsing 할 수 있어야 한다

메모리

컴퓨터는 cpu로 연산하고, 메모리로 기억한다.
메모리란 데이터를 저장할 수 있는 메모리 셀의 집합체다.
메모리 셀은 1byte(8bit. 컴퓨터가 데이터를 저장하고 읽어들이는 최소단위)씩으로 구성되어있다
각 셀은 고유의 메모리 주소를 가진다.
메모리 주소란 메모리 공간의 위치를 의미하고, 0부터 시작해서 메모리 크기만큼 정수로 표현된다.
컴퓨터는 모든 데이터를 2진수로 처리한다. 데이터의 종류 (숫자, 텍스트, 이미지, 동영상)에 상관없이 모두 2진수인것.

연산 결과값을 재사용하려면 어떻게 해야 할까?

메모리 공간에 접근해야 하는데, 메모리 주소는 코드가 실행될 때마다 메모리의 상황에 따라 임의로 결정된다. (동일한 컴퓨터, 동일한 코드여도 실행될 때마다 변경된다.) 실행되기 이전에 알 수 없고, 알려주지도 않는다. 주소를 통한 직접접근은 자칫 운영체제가 사용하고 있는 메모리의 값을 변경할 위험도 내포하고 있다.

변수를 사용하자!

변수란 하나의 값을 저장하기 위해 확보한 메모리 공간 자체, 그 메모리 공간을 식별하기 위해 붙인 이름이다.
값의 위치를 가리키는 상징적인 이름으로, 컴파일러 혹은 인터프리터에 의해 메모리 공간 주소로 치환되며 이로인해 개발자가 안전하게 저장하고 참조할수 있게 된다

변수에 값을 저장하는 것은 할당 assignment (대입, 또는 저장) 이고
변수의 값을 읽어들이는 것은 참조 reference다.

4.2 식별자

메모리 상에 존재하는 어떤 값을 식별할 수 있는 이름은 모두 식별자라고 부른다.
해당 식별자는 자신과 매핑된 메모리주소를 기억해야한다.
값이 아닌, 이 주소를 기억하고 있기에 주소를 통한 참조를 돕는다.


오늘서핑

ECMA-262

ECMA스크립트 :위키백과

  • ECMA스크립트(ECMAScript, 또는 ES)란, Ecma International이 ECMA-262 기술 규격에 따라 정의하고 있는 표준화된 스크립트 프로그래밍 언어를 말한다. 자바스크립트를 표준화하기 위해 만들어졌다. 액션스크립트와 J스크립트 등 다른 구현체도 포함하고 있다.

표준 자바스크립트 라고 알고 있었는데, 액션스크립트와 J스크립트등의 다른 구현체도 포함하고 있는 줄은 몰랐다. 서로 표준을 준수하면서, 각자의 기능을 지원한다는데 다른 스크립트 언어들도 궁금해졌다.

자바스크립트 언어 자료:MDN
ECMA-262 및 ECMA-402 스펙에서 표준화되었습니다.

262는 표준언어 사양을, 402는 국제화 API규격에 대해서 다루고 있는 듯 하다.

예전에 ECMA 단체가 운영되는 방식 (조직구성과 내규등)에 대한 글을 읽었던 적이 있는데, 국제 표준을 정하는 단체가 일하는 방식이 무척 인상깊었다. 일단 모든 자료가 Git에 공개되어있고,(웹에서 회의의 녹음파일과 html회의록, pdf회의록 역시 다운받을 수 있다) 표준안 마련에 기여하고자 하는 이는 누구든 참여할 수 있다는것, TC (Technical Committees)와 Task Groups (TG)의 방식이 이상적으로 느껴졌기 때문이다. 해당 단체에 대해서는 나중에 더 자세히 알아보고 싶다.

알 수 없는 시리얼넘버같은 이 네이밍 센스의 역사도 궁금하다

브라우저 시장을 독점한다는 것

이렇게나 웹표준을 어겨가며 기술경쟁에 뛰어들어 브라우저 시장을 독점한다는게, 어떻게 수익창출로 이루어지길래 모두 필사적이었는지 궁금해졌다. 브라우저는 무료로 제공되는 소프트웨어인데 어디서 수익이 발생하는건지. 혹시 이용자 데이터를 독점해서 판매할 수 있어서 그런가? 생각하다가 아래 기사를 접했다

웹브라우저 독점, 어떻게 해결해야 하나? : 정보인권

  • 대다수 컴퓨터 사용자는 컴퓨터를 사용하는 시간의 대부분을 웹브라우저를 이용하며 보낸다. 웹사이트를 방문하여 정보를 검색하고, 자신이 가입한 커뮤니티 게시판에 글을 쓰고, 동영상, 음악 서비스를 사용한다. 대부분의 콘텐츠는 웹브라우저에서 읽을 수 있는 형태로 가공되고 있다. 이런 점에서 웹브라우저의 독점은 소프트웨어 차원의 문제에만 그치는 것이 아니다. 인터넷 익스플로러로 접근 가능한 웹사이트란 결국 인터넷 익스플로러로만 읽을 수 있는 콘텐츠라는 것이다. 콘텐츠의 대부분이 인터넷 익스플로러 전용으로 만들어진다면 마이크로소프트는 컴퓨터와 인터넷 환경 자체를 독점할 수 있게 된다.
  • 윈도95가 출시되었을 때 마이크로소프트는 월드와이드웹이 아닌 엠에스엔(MSN)이라는 독자적인 네트워크를 준비하였다 (중략) 인터넷의 급격한 발전으로 마이크로소프트는 MSN을 윈도98부터 포기했다. 인터넷 익스플로러로만 접근 가능한 콘텐츠(웹사이트)는 결국 인터넷 이전의 시대로 돌아가는 것이며, 인터넷 익스플로러로만 접근 가능한 월드와이드웹은 월드와이드웹이 아니라 또 다른 형태의 폐쇄적인 MSN일뿐이다.
  • 독점하는 자는 표준을 지키지 않는다

해당 글은 2004년에 작성된 글로, 정보인권이라는 사이트에 아카이빙되어있었다. 덕분에 진보네트워크센터와 정보인권이라는 개념을 접하고, 스크랩 해두었다.

단 몇분의 네트워크 오류에 치명적인 영향을 받게된, 디지털 의존도가 높아진 세상에서 살아왔으면서 정보 인권이라는 개념을 뒤늦게 접하게 되었다는게 아쉽다.

디지털 산업분야에서 기업독점을 견제하기 어렵고, 부당함을 참는 수밖에 없다는 어떤 무기력감이 있다. (모든 문제는 하청업체 탓이겠지...) 하지만 언제나 미래를 바라보며 발언하는 분들이 계셨구나 싶어 슬픔이 덜해졌다.

구글 독점 논란의 역사 10년 살펴보기 : 바이라인네트워크

그리고 위 기사를 통해 어떻게 브라우저 독점이 인터넷 시장 독점으로 이어지는지 그 과정에서 어떤 수익을 부당하게 창출하는지 잘 알게 되었고...

카카오톡'인앱브라우저'강제, 이용자 '데이터 독점' 논란

  • 카카오톡 인앱브라우저 강제 이용에 대한 이용자 별도 동의, 약관 등도 부재한 것으로 확인됐다. 삼성 인터넷, 크롬 등 여타 브라우저 서비스의 경우 이용약관 등을 통해 브라우저 서비스 제공에 대해 이용자 고지하고 있다. 반면, 카카오톡 약관에서는 '인앱브라우저 이용 강제 의무, 이용자 동의 여부, 인앱브라우저 데이터 활용' 등 인앱브라우저에 대한 내용이 전무했다.
  • 문제는 카카오톡이 인앱브라우저를 이용자 데이터 독점 수단으로 활용 가능하다는 점이다. 주요 관심사 등이 반영된 이용자들의 각종 인터넷 링크, 방문기록 등이 인앱브라우저를 통해 카카오로 귀속돼 관련 데이터 독점이 가능한 구조다. 이를 통해 카카오톡 '톡비즈' 등 각종 데이터 기반 광고를 통해 매출을 올리고 있다는 것. 톡비즈의 지난해 매출은 1조 1178억원으로 전년 대비 72% 늘었으며, 2022년에는 2조원대에 달할 것으로 예상된다.

이 기사를 보고 아이고 싶었다. 그러게. 카카오톡에서 링크를 누를때면 뜨는 해괴한 창이 (제대로 표시되는게 일절 없다) 인앱 브라우저셨군요...?

불편한 인앱브라우저 하니 다음으로는 인스타그램이 떠오른다. 인스타그램이야말로 모든 링크를 인앱 브라우저에 연결시켜서, 모든 이용자 데이터를 수집했으니 매일 내가 살만한 것들을 띄워주겠지...

더 의문인건 이 인앱 브라우저들이 모두 구리다는 것이다. 어쨌든 이용자들이 자사의 인앱브라우저를 이용하길 바란다면, 적어도 성능개선에 힘을 쓰거나 해서 이탈하지 않도록 해야하지 않나? 인스타그램 인앱브라우저에서 (인앱브라우저인줄 모르고) 결제화면까지 갔다가 튕겼던게 한두번이 아니다. 정말 '이용자 데이터 수집'만이 목적이기 때문일까?

디지털 서비스 약관의 허술함, 검토하기 어려운 공개 방식에 대해서도 다시 고려해보게 된다.

함수형 프로그래밍

무턱대고 강의를 듣다가 참패하여 기본서를 읽는 나날이다.

내게 자바스크립트의 어려움은

  • 코드가 조금만 길어지면 어디서 누가 누굴 호출했는지 머리가 꼬이는 느낌이 든다는 것과,
  • 그동안 축적된 진보된 문법의 진도를 아직 따라잡지 못해서 일어나는 엄청난 괴리감

이 두가지로 정리되는 것 같다. 그 와중에 숨을 돌릴겸 일본 개발자 커뮤니티 Qiita를 둘러보다가 재미있는 글을 발견했다.

オブジェクト指向と関数型プログラミング:関数型プログラミング編

오브젝트지향과 함수형프로그래밍: 함수형프로그래밍론 이라는 글인데 너무 어이없게 재미있다. (서술방식과 저 유머코드가...) 함수형 프로그래밍에 대해 검색해보면 함수가 일급객체가 되어 인자가 될수있는, 하나의 기능을 수행하는 함수로 언제나 입력에 따른 출력값이 동일한, 재사용성이 좋은, 등의 글을 접하게 되는데 전혀 와닿지 않았던걸, 이 글에서 어느정도 해소할 수 있었다.

currying과 compose의 예시를 무척 쉬운코드로 볼 수 있어서 기뻤다. 아 궁극적으로 이것을 위해 달려온 것인가?! 미래에는 좀더 분명히 알 수 있겠지. 또 이분이 링크해주신 블로그가 매우.. 흥미롭다!

Getting started with Functional Programming by Anwesha Chatterjee:

노드걸스라는 단체의 오거나이저분의 블로그. 요약된 설명들이 있는게 아니라 고민하고 생각한 과정을 적어주셔서 좋다. 다른 글들도 차례차례 읽어나가고 싶다.

프로토 타입 기반 프로그래밍

자바스크립트. 만만치 않다. 객체지향과 함수형 프로그래밍 두개의 수박겉핥기를 하기에도 벅찬데 멀티 패러다임 언어라고 한다.

최근 면접에서 프로토타입이 무엇인지 질문받았던 적이 있어서, (게다가 그것이 프로토타입이라는 '언어'에서 따온것이라고 알려주셨다. 언어였다고?! 나는 그 자리에서 매우 흥분하였다.) 위키백과에서 찾아보았다.

프로토타입 기반 프로그래밍

  • 프로토타입 기반 프로그래밍은 객체지향 프로그래밍의 한 형태의 갈래로 (중략) 클래스 기반 언어에서 상속을 사용하는 것과는 다르게, 객체를 원형(프로토타입)으로 하여 복제의 과정을 통하여 객체의 동작 방식을 다시 사용할 수 있다. 프로토타입기반 프로그래밍은 클래스리스(class-less), 프로토타입 지향(prototype-oriented) 혹은 인스턴스 기반(instance-based) 프로그래밍이라고도 한다.

내가 처음 배웠던 프로그래밍언어는 Java였는데, 이게 객체지향 언어이면서도 새로운 기능들이 계속 (함수형 프로그래밍이 가능하도록..?) 도입되고 있고, 결과적으로 각 패러다임의 장점을 흡수하는 방향으로 진화해서 언어들이 모-던해진다고 느꼈다. javascript는 프로토 타입기반이라면서 class도 있고.

온전히 하나의 패러다임을 추구하는 언어를 사용해보며 해당 패러다임을 음미해본적이 없다는 생각이 든다. 그러니 프로그래밍 패러다임이 매번 낯선게 아닐지.

그러나 시간이 해결해줄 것이다.
요즘의 나는 열심히 산다.
그러니
미래의 나는.... 왜인지 알게 될것 같다는
근거없고 모호한 기분좋음을 마다하지 않으며 꾸준히 공부하려고 한다.

profile
에메랄드 바다의 웹서퍼

0개의 댓글