window.location과 document.location 실제로는 같은 방식으로 사용합니다.
공식적으로 window.location은 현재 위치를 object 값으로 가져올 수 있는 표준방법이고
document.location는 현재 URL 값이 String으로 반환됩니다.
이러한 혼란을 피하기 위해 document.location은 document.URL로 변경되었습니다.
모든 최신 브라우저는 document.location을 window.location에 매핑하고 있습니다.
| Coding Style - 네이밍 룰 (0) | 2016.08.24 |
|---|---|
| 414 request 오류 (0) | 2016.08.08 |
| 요다 조건문 / Yoda Conditions (0) | 2016.08.02 |
맥에서 알파벳 입력 유지시 액센트 문자 팝업 비활성화
터미널에 입력하시면 됩니다.
defaults write -g ApplePressAndHoldEnabled -bool false
1. 카멜 표기법(Camel Notation)
두 개 이상의 단어로 이루어진 변수 이름에서 첫 단어는 소문자로 시작하고, 나머지 단어는 모두 대문자로 시작하는 방식.
getPrice, getChange
2. 헝가리언 표기법(Hungarian Notation)
변수 명에 변수의 타입을 접미어를 붙여 명시하는 방식
int price -> nPrice
String customer -> sCustomer
3. 파스칼 표기법(Pascal Notation)
모든 단어의 시작을 대문자로 표기하는 방법
GetPrice, GetChange
4. 언더스코어 표기법(Underscore Notation)
각 단어를 구분하기 위해 언더스코어를 사용
get_price, get_change, first_customer
| window.location document.location 차이점 (0) | 2017.05.12 |
|---|---|
| 414 request 오류 (0) | 2016.08.08 |
| 요다 조건문 / Yoda Conditions (0) | 2016.08.02 |
카카오와 옥스포드의 콜라보 제품인 '라이언 버스' 를 샀으요!!
가격은 39000원
세 번째 콜라보 제품이라고 하므요
미피는 어피치, 튜브, 라이언
박스를 뜯으면 구성품이이써요
스티커랑 설명서가 있네요
설명서 보고 뚝.딱.뚝.딱
버스의 하판 부분을 먼저 뚝.딱.뚝.딱
꽤나 디테일하져???
운전석이랑 기어도 있어여 ㅋㅋㅋ
출입문 부분에 스티커를 샥샥
버스의 상판 부분을 뚝.딱.뚝.딱
좀 신기한 블럭이 있었어요
요렇게 생긴 블럭인데
양쪽으로 연결할 수 있도록 되있더라구여
이걸 어디다 쓰나 했는데.....
...
.....
요렇게 쓰더라구요 라이언 버스의 앞 얼굴 부분인 인 것 같죠??
신기방기!!
요렇게 스티커를 붙여주면~~~
얼굴 짜잔!!
버스 지붕을 만들어주고~~ 역시나 뚝.딱.뚝.딱
꼬리도~~?
뚝.딱.뚝.딱
지붕을 얹고 꼬리와 얼굴을 붙어주면..?
짜잔.!!!!!!!
졸귀탱 ㅠㅜ, 어머 이건 사야해
다른 레고 포스팅으로 찾아뵐게여~~
안뇽~~
웹 서버 요청시 GET 방식과 POST 방식 등이 있는데
GET 방식으로 서버 요청 시 긴 URL의 요청이 들어올 경우 414 Request-URI Too Large 오류가 발생합니다.
해결 방법은..
첫 번째로 GET으로 보내던 방식을 POST로 변환 하는 방법이 있습니다.
두 번째로는 서버에서 요청 발생 시 client header buffer를 늘려주는 방법이 있지만 리소스가 한정적이기 때문에 완벽한 해결 방법은 아닙니다.
또한 브라우저마다 URI의 길이 제한이 있기 때문에 가급적이면 URI가 길 경우 POST 방식으로 변경해주는 것이 좋겠습니다.
| window.location document.location 차이점 (0) | 2017.05.12 |
|---|---|
| Coding Style - 네이밍 룰 (0) | 2016.08.24 |
| 요다 조건문 / Yoda Conditions (0) | 2016.08.02 |
Javascript에서 느낌표 두개(!!) 연산자를 사용해서 코드를 작성하는 경우가 종종있는데 어떤 역할을 하는지 궁금했습니다.
알아보니..
Javascript에서 느낌표 두개(!!)를 사용하면 0, null, undefined 등과 같은 정의 되지 않은 변수들을 강제 변환하여 정확한 논리 결과인 true / false를 만들어 줍니다.
아래 코드를 보면 이해가 바로 됩니다.!
let a = 0; console.log(a); // 0 console.log(!a); // true console.log(!!a); // false let b = null; console.log(b); // null console.log(!b); // true console.log(!!b); // false let c = undefined; console.log(c); // undefined console.log(!c); // true console.log(!!c); // false
이런 식으로 애매한 변수들을 정확한 논리 결과의 표현을 원할때에 사용할 수 있습니다.
아래 코드는 "흠.. 이런 경우엔 어떤 결과가 나올까?" 생각해볼 수 있는 예제입니다.
!!false === false
!!true === true
!!0 === false
!!parseInt("foo") === false // NaN은 false
!!1 === true
!!-1 === true // -1 는 true
!!"" === false // 빈 문자열은 false
!!"foo" === true // 일반 문자열은 true
!!"false" === true // false라는 문자열도 true
!!window.foo === false // 정의 되지 않은 변수는 false
!!null === false // null은 false
!!{} === true // 빈 객체는 true
!![] === true // 빈 배열은 true
if ( $value == 42 ) {
/* ... */
}
위 코드는 '만약 value의 값이 42와 같다면..' 이라고 읽힙니다.
하지만 요다 조건문을 이용하게 되면 아래와 같이 작성됩니다.
if ( 42 == $value ) {
/* ... */
}
위 코드를 눈으로 읽어보면 '만약 42가 value와 같다면..' 이라고 읽힙니다.
이런식으로 상수가 왼쪽 변수가 오른쪽으로 작성되는 것을 요다 조건문이라고 합니다.
이렇게 작성하면 컴파일 단계에서 오류를 뱉어내기 때문에 코드를 실수로 작성했을 때 알아보기 쉽다는 장점이 있습니다.
if (42 = myNumber) {
/* ... */
} // This is a syntax error and will not compile
...
...?
왜 요다 조건문이지??
이는 스타워즈의 요다의 말투가 어순을 바꿔 말하기 때문입니다.
영어 : Go, I will. Good relations with Wookiees, I have.
원문 번역 : 가겠네, 내가. 우키족과 좋은 관계를 가지고 있지, 나는.
어법에 맞춘 번역 : 내가 가겠네. 우키족과 좋은 관계를 가지고 있으니.
출처 : https://en.wikipedia.org/wiki/Yoda_conditions
| window.location document.location 차이점 (0) | 2017.05.12 |
|---|---|
| Coding Style - 네이밍 룰 (0) | 2016.08.24 |
| 414 request 오류 (0) | 2016.08.08 |
eCPM = (전체 수익 / 전체 노출 수) * 1000
-> 1000회 노출당 얻을 수 있는 광고 수익 예측 값
예를 들면, A와 B라는 두 채널을 가지고 있다고 가정해 봅니다. 테스트 동안 A 채널은 410 뷰가 노출되었고 총 수익은 $2.92이고
B 채널은 232 뷰가 노출되었고 총 수익은 $0.23 이라면 두 채널의 수익 비교를 위해 eCPM을 계산하면 됩니다.
1000회 노출 동안 추측할 수 있는 각 채널의 수익은 A채널의 경우 $7.12이며 B채널의 경우는 $0.9가 됩니다.
이러한 eCPM을 계산한 값을 토대로 수익을 위해 A채널의 광고로 교체해야한다는 계산이 서게됩니다.
범위 지정에 쓰이는 특수 기호(메타 문자)
| 명령어 | 설명 |
|---|---|
. |
현재 행을 의미합니다. |
$ |
마지막 행을 의미합니다. |
+# |
현재 위치에서 #만큼 아래 행을 의미합니다. |
-# |
현재 위치에서 #만큼 행을 의미합니다. |
% |
문서 파일 전체를 의미합니다. |
행 번호로 범위를 지정하는 방법은 불편합니다. 비주얼 모드라는 것은 마우스를 드래그 하듯이 시각적으로 블록을 선택,복사,삭제 할 수 있습니다.
비주얼 모드 기능
명령어 |
설명 |
|---|---|
| v | 현재 커서 위치에서 블록을 지정 |
| V | 현재 커서가 위치한 행에서 행 단위로 블록을 지정 |
Tip. 비주얼 모드로 텍스트를 선택하고 u를 선택하면 모두 소문자로 변환하고 U를 누르면 대문자로 변환합니다. ~를 누르면 대,소문자가 스위칭됩니다.
Vim을 더욱 편하게 사용하려면 각종 옵션과 색상 테마를 설정해야 합니다. 궁금한 기능을 찾아서 볼 수 있도록 도움말을 사용하는 방법과 도움말에서 검색어를 사용하는 방법을 알아 봅시다.
옵션 설정
| 명령어 | 설명 |
|---|---|
| :set | 옵션 설정 |
| .vimrc | 옵션 파일 |
| .colo | 색상 테마 |
| .help | 도움말 |
set 명령어 사용법
| 명령어 | 설명 |
|---|---|
| :set | 현재 옵션 설정을 보여줍니다. |
| :set all | 모든 옵션 설정을 보여줍니다. |
| :set [no]name | name에 해당하는 옵션을 켜거나 끕니다. |
| :set name! | name에 해당하는 옵션 상태를 전환합니다. |
| :set name=value | name에 해당하는 옵션에 value 값을 할당합니다. |
Tip. 명령행 모드에서 :set all 명령어를 입력시 출력 결과가 열이 딱 맞이 낳고 들쑥 날쑥한 것이 보이는데 no가 앞에 붙은 옵션은 현재 비활성화 상태고 no가 붙지 않은 것들은 활성화 상태입니다. :set 명령어 입력시 현재 설정된 주요 설정들만 간략하게 볼 수 있습니다.
편집에 관련된 기초 옵션들
| 명령어 | 설명 |
|---|---|
| nu(number) | 화면에 행 번호를 표시합니다. |
| ai(autoindent) | 자동 들여쓰기를 사용합니다. |
| cindent | C 스타일의 들여쓰기를 제공합니다. |
| ts=value(tabstop) | 탭 크기를 value로 지정합니다. |
| sw=value(shiftwidth) | 블록 이동시 열의 너비입니다. |
| tw=value(textwidth) | 편집할 화면의 열 길이를 정합니다. (0이면 비활성화) |
Tip. sw(shiftwidth)는 ts(tabstop)보다 같거나 작아야합니다.
설정 파일 만들기
Vim을 실행한 후 리눅스, 유닉스 맥 에선 :e ~/.vimrc라고 명령하고 윈도 계열에선 :e ~/_vimrc 라고 명령합니다.
" vim runtime configuration file
" 행 번호 표시
set nu
" 자동 들여쓰기, C스타일 들여쓰기 설정
set ai cindent
" 탭 크기, 블록 이동시 열의 너비 지정
set ts=4 sw=4
쌍따옴표(")는 주석문 입니다.
문법 오류 표시
| 명령어 | 설명 |
|---|---|
| :syntax enable | 문법 표시를 사용합니다. |
| :syntax clear | 문법 표시를 사용하지 않습니다. |
| :colorscheme | |
| blue, darkblue, default ... | 테마 종류 |
Tip. 기본 내장 되어 있는 테마들 말고도 다른 사람들이 만들어 놓은 테마들도 사용하실 수 있습니다. 저 같은 경우는 sublime text에서 monokai를 사용했었는데 혹시나 해서 찾아보니 vim용도 제작되어 있네요. monokai Theme Github ~/.vim/colors/ 폴더에서 받으신 파일(monokai.vim)을 넣으시고 ~/.vimrc 에
syntax enable colorscheme monokai코드를 입력하시면 됩니다.
도움말에 사용되는 접두어
| 명령어 | 설명 |
|---|---|
| nu(number) | 화면에 행 번호를 표시합니다. |
| ai(autoindent) | 자동 들여쓰기를 사용합니다. |
| cindent | C 스타일의 들여쓰기를 제공합니다. |
| ts=value(tabstop) | 탭 크기를 value로 지정합니다. |
| sw=value(shiftwidth) | 블록 이동시 열의 너비입니다. |
| tw=value(textwidth) | 편집할 화면의 열 길이를 정합니다. (0이면 비활성화) |
응용 프로그램을 개발하기 위해선.. 더 나은 환경을 제공해주는 에디터나 IDE를 사용해야 합니다.
개발하려는 프로그램의 목적에 맞게끔 나와있는 좋은 에디터와 IDE가 많습니다. 취향에 따라 선택할 수 있을 정도로 많지요. 또한 늘 그렇듯이 프로그램 개발 환경은 앞으로도 더욱 발전할 것입니다.
그 중에서도 저는 웹 개발시 Sublime Text를 주로 사용하고 있는데 윈도우와 맥으로 환경을 자주 변경해야 하는 문제가 있어 설치한 테마라든지 플러그인 옵션들을 드랍박스를 통해 동기화 하곤 합니다.
어떤 플러그인은 지원하는 OS가 다르긴하지만 계속 사용해도 문제 없을 정도로 좋습니다.
하지만.. 뭔가.. 내 것 아닌.. 내 것 같은 에디터 같은 느낌적인 느낌이 들곤합니다..
나도 겉멋만 들어 Vim 같은 에디터를 사용하여 Geek 스러운 느낌을 주고 싶은건지.. 가상 머신으로 리눅스 환경에서 할 수 있는 것이 많이 제약이 되어서 그런가.. 가끔식 충돌하는 Sublime Text 문제 때문에 그런지..
장인은 도구를 탓하지 않는 다지만;; 왜 인지는 저도 잘 모르겠습니다..
언젠가부터 Vim에 대한 욕구가 계속 상승하네요
그래서 Vim에 대한 자료 몇개를 찾았습니다.
1. 코드라이언 - http://codelion.net/weeks/overview/2 - 챕터 마지막에 문제도 제공하네요!
2. 손에 잡히는 VIM
이렇게 두개를 먼저 보기로 했습니다. 손에 잡히는 VIM은 이제 막 1장을 넘겼구요~
일단 실제로 에디터를 접해보니 재밌네요. 색다르고. CUI 에디터라니 신기하기도 하고,,
앞으로 공부하다 얻은 팁들은 제 블로그에 틈틈히 남겨봐야 겠습니다.
| Vim 단축키 #2 (0) | 2015.02.23 |
|---|
이 게시물에 댓글