[카테고리:] 프로그래밍

작성일자

[JavaScript] 주의해야 할 ‘변수에 대한 호이스팅(hoisting)’

자바스크립트에서 변수에 대한 호이스팅이라는 개념이 있습니다. 함수 안에 정의된 모든 변수는 선언된 그 위치에 상관없이 함수의 윗부분으로 끌어올려(hoist)된다라는 개념입니다. 여기서 주의할 점은 자바스크립트에서 함수도 객체 변수이며 이 함수가 호이스팅될때입니다.. 함수를 정의하고 선언하는 방법을 크게 2가지로 구분할 수 있습니다.

  • 표현식에 의한 정의
  • 선언문에 의한 정의

먼저 표현식에 의한 정의의 예는 다음과 같습니다.

var bar = function() {
     // 표현식에 의한 함수 정의 
};

다음은 선언문에 의한 정의의 예입니다. 

function foo() { 
    // 선언문에 의한 함수 정의
}

이러한 함수 정의가 함수 안에서 이루어질때 호이스팅에 차이가 발생하게 됩니다. 

function test() { 
    alert(typeof foo); 
    alert(typeof bar); 

    function foo() { 
        // 선언문에 의한 함수 정의 
    } 
    
    var bar = function() {
         // 표현식에 의한 함수 정의 
    }; 
} 

test();

위의 코드를 실행해 보면 처음에는 “function”이라는 메세지가 표시되고 다음에는 “undefined”라는 메세지가 표시됩니다. 이는 표현식에 대한 함수 정의시에 함수 객체가 호이스팅될때 함수의 코드부분은 호이스팅되지 않지만 선언문으로 함수가 정의될 경우에는 함수의 코드부분까지도 호이스팅된다는 것을 알 수 있습니다. 

작성일자

[Android] ProgressDialog의 메세지(Message) 폰트 크기 키우기

안드로이드에서 사용자에게 잠시 기다려 줄 것을 요청하는 방법 중 하나로 ProgressDialog를 사용합니다. 그런데 이 ProgressDialog에 표시되는 메세지의 폰트가 쥐불알만합니다..

사용자 삽입 이미지
해서 이 폰트를 전체적인 화면과 어울리게 좀 키워보려고 했고, 그 방법 중에 가장 간단한 방법은 다음과 같습니다.

inkTaskProgressDlg = ProgressDialog.show(
    DASSActivity.this, 
    "펜 메모 준비",
    Html.fromHtml("지도 이미지에 대한 펜 메모를 준비 중입니다. 잠시만 기다려 주세요.."), 
    true, 
    false);

네, 바로 Html.fromHtml를 이용해 텍스트에 스타일을 지정하는 방법입니다. HTML 방식으로 문자 스타일을 지정하니 색상이며 굵기등도 지정이 가능합니다. 안드로이드… 상당히 쓸만한 물건이라는 생각입니다. 위의 코드에 대한 결과는 아래와 같습니다.

사용자 삽입 이미지
다음 주 정도 지자체에 안드로이드 기반의 현장지원시스템을 납품합니다(담당자 분의 납품 승인을 받아야 할텐데.. -_-;). 거즘… 마무리하고 소소하지만 중요한 사용자 편의성을 다듬어 보면서 얻은 내용을 정리해 봅니다.

작성일자

[Java] URL로부터 데이터(문자열) 읽어오기

지정된 URL에 존재하는 데이터소스로부터 데이터, 특히 문자열 값으로 읽어오는 자바 코드입니다.

URL url = null;
try {
    url = new URL("http://222.237.78.208:8080/yp_tiles/a/metadata.xml");
} catch(MalformedURLException e1) {
    e1.printStackTrace();
}

InputStream in = null;
try {
    in = url.openStream();
    byte[] buffer = new byte[128];
    int readCount = 0;
    StringBuilder result = new StringBuilder();
   
    while((readCount = in.read(buffer)) != -1) {
        String part = new String(buffer, 0, readCount);
        result.append(part);
    }   
   
    System.out.println(result);
} 
catch (IOException e) {
    e.printStackTrace();
}

위의 코드를 실행하게 되면 해당 URL로부터 가져온 데이터가 문자열로써 result 변수에 저장됩니다. 저장된 결과에 대한 화면 표시는 다음과 같습니다.

사용자 삽입 이미지
위의 결과는 타일맵으로 가공된 데이터에 대한 메타 데이터입니다.

작성일자

[C++] 복사생성자, 소멸자, 대입연산자

C++을 학습하던 때에 제법 깊이 있게 생각하며 봤던 C++ 내용 중 복사생성자와 소멸자 그리고 대입연산자가 있었습니다. 마치 스타크래프트에서 등장하는 유닛들의 이름을 한글화 해 놓은 것은 이 3가지에 대해서 정리해 봅니다.

기본적으로 C++은 복사생성자, 소멸자, 대입연산자를 프로그래머가 정의해 놓지 않을 경우 정해진 기본 기능을 수행하는 복사생성자와 소멸자, 대입연산자를 만들어 놓는다고 가정할 수 있습니다.

기본 기능에 대한 복사생성자는 해당 클래스의 맴버 변수의 값을 그대로 복사합니다. 또한 기본 기능에 대한 소멸자는 해당 클래스의 맴버 변수의 소멸자를 호출해 줍니다. 그리고 기본기능에 대한 대입연산자는 해당 클래스의 맴버 변수의 값을 그대로 복사합니다.

여기서 언급된 맴버 변수의 값에 대한 복사라함은 단순한 값의 복사로써 만약 맴버 변수가 포인터일 경우 그 변수가 가르키고 있는 값까지 복사하는것이 아닌 주소값만을 복사한다는 의미입니다. 바로 이 포인트에 대한 부분이 C++에서 복사생성자와 소멸자, 대입연산자의 중요함이 강조되는 부분입니다.

아래의 코드는 이들 세가지(복사생성자, 소멸자, 대입연산자)에 대한 작성방법 및 이들을 제공하지 않았을 경우 어떻게 이들 세가지가 호출되는지를 보여주는 예입니다. 작성방법은 클래스 M에서 파악할 수 있고 호출 순서와 여부는 클래스 X에서 파악할 수 있습니다. 클래스 X는 이들 셋을 정의하고 있지 않으므로 C++에서 기본적으로 제공하는 기능에 대해 수행된다고 확신할 수 있습니다.

먼저 클래스 M에 대한 코드입니다.

class M {
public:
    M() {
        cout << "M::default-ctr is called" << endl;
    }

    M(const M&) {
        cout << "M::copy-ctr is called" << endl;
    }

    ~M() {
        cout << "M::dtr is called" << endl;
    }

    M& operator=(const M&) {
        cout << "M::oper= is called" << endl;
        return *this;
    }
};

여기서 기본생성자(M::default-ctr is called를 출력하는 함수)가 추가로 제공되고 있습니다. C++은 프로그래머가 생성자를 추가하지 않으면 기본생성자를 자동으로 추가해 주지만, 여기서는 복사생성자를 추가하고 있음으로 프로그래머가 직접 기본 생성자를 추가해 주어야 합니다.

다음은 클래스 X이며 이 클래스는 복사생성자와 소멸자, 대입연산자를 프로그래머가 제공하지 않으며 단순히 맴버 변수로써 클래스 M만을 가지고 있습니다.

class X {
    M m;
};

이제 클래스 X를 생성하고 대입하는 코드를 통해 복사생성자와 소멸자, 대입연산자의 호출을 확인해 보도록 하겠습니다. 

X x;
X y = x;
x = y;

실행 결과는 다음과 같습니다.

사용자 삽입 이미지
1번 코드에 의해서 M::default-ctr is called가 표시되며 2번 코드에 의해서 M::copy-ctr is called가 호출됩니다. 그리고 3번 코드에 의해서 M::oper= is called가 호출됩니다. 그리고 이 프로그램의 유효범위가 종료됨으로써 직역변수로 선언된 x와 y에 대한 소멸자가 각각 1번씩 호출됩니다.

작성일자

[JavaScript] 클래스 상속

자바스크립트에서 클래스의 상속 개념을 정리해 보고자 합니다. 먼저 크기값(width, height) 만을 갖는 Rectangle라는 클래스가 있고 이 클래스를 상속받으면서 위치값(x, y)를 갖는 PositionedRectangle 클래스를 만들어 보는 예를 통해 정리하고자 합니다. (이 글은 인사이트의 자바스크립트 완벽가이드 내용을 읽고 이해하여 짧게 요약한 글입니다)

가장 먼저 Rectangle이라는 클래스 정의 코드입니다.
function Rectangle(w, h)
{
    this.width = w;
    this.height = h;
}

Rectangle.prototype.area = function()
{
    return this.width * this.height;
}

Rectangle.prototype.toString = function() 
{
    return "[" + this.width + ", " + this.height + "]";
}

생성자 함수에서 크기값에 대한 인자 w, h를 받습니다. 그리고 area라는 매서드와 toString이라는 매서드를 정의하고 있습니다. 이후에 Rectangle 클래스를 상속받아 toString 함수를 재정의할때 부모 클래스의 toString을 호출하는 방법을 살펴보도록 하겠습니다.

자, 이제 PositionedRectangle이라는 클래스를 Rectangle 클래스를 상속받아 정의하는 코드를 보겠습니다.
function PositionedRectangle(x, y, w, h)
{
    Rectangle.call(this, w, h);
    
    this.x = x;
    this.y = y;
}

3번 코드에서 상속받을 Rectangle 클래스를 지정합니다. 그리고 PositionedRectangle의 부모 클래스가 Rectangle이라는 것을 명확히 하도록 다음 코드를 추가합니다.

PositionedRectangle.prototype = new Rectangle();

위의 코드의 문제점은 PositionedRectangle의 생성자 함수까지도 Rectangle로 지정된다는 점입니다. PositionedRectangle의 생성자 함수를 다시 자기의 것으로 지정되도록 다음 코드를 추가합니다.

PositionedRectangle.prototype.constructor = PositionedRectangle;

또 한가지 문제가 있는데, 그것은 중복된 데이터입니다. PositionedRectangle는 Rectangle로부터 상속을 받았으므로 Rectangle의 width와 height 데이터를 갖습니다. 그런데 이 값이 각각 2개씩 중복(PositionedRectangle에 하나, PositionedRectangle.prototype에 하나)되어 갖고 있습니다. 해서 중복되지 않도록 제거해 주는 코드가 필요합니다.

delete PositionedRectangle.prototype.width;
delete PositionedRectangle.prototype.height;

이제 옵션으로 PositionedRectangle 자신의 함수를 추가하는 코드입니다.

PositionedRectangle.prototype.contains = function(x y)
{
    return (x > this.x && x < this.x + this.width 
        && y > this.y && y < this.y + this.height);
}

끝으로 부모 클래스의 메서드 함수를 재정의할때 부모 클래스의 메서드 함수를 호출하는 방법입니다. toString 함수를 예로 정리하면, PositionedRectangle에 다음처럼 toString 함수를 재정의할 수 있습니다.

PositionedRectangle.prototype.toString = function()
{
    return "(" + this.x + ", " + this.y + ") " 
        + Rectangle.prototype.toString.apply(this);
}