<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
    <channel>
        <title>mecd.log</title>
        <link>https://velog.io/</link>
        <description>기술로 더 나은 미래를 디자인하는 개발자 MEC:D 입니다</description>
        <lastBuildDate>Sat, 08 Apr 2023 09:56:46 GMT</lastBuildDate>
        <docs>https://validator.w3.org/feed/docs/rss2.html</docs>
        <generator>https://github.com/jpmonette/feed</generator>
        <image>
            <title>mecd.log</title>
            <url>https://images.velog.io/images/m-dzn/profile/7d5b1ac0-910c-4154-af2b-3f5e62e9acb3/1398936970643.jpg</url>
            <link>https://velog.io/</link>
        </image>
        <copyright>Copyright (C) 2019. mecd.log. All rights reserved.</copyright>
        <atom:link href="https://v2.velog.io/rss/m-dzn" rel="self" type="application/rss+xml"/>
        <item>
            <title><![CDATA[Real MySQL | 설치와 설정 요약]]></title>
            <link>https://velog.io/@m-dzn/Real-MySQL-%EC%84%A4%EC%B9%98%EC%99%80-%EC%84%A4%EC%A0%95-%EC%9A%94%EC%95%BD</link>
            <guid>https://velog.io/@m-dzn/Real-MySQL-%EC%84%A4%EC%B9%98%EC%99%80-%EC%84%A4%EC%A0%95-%EC%9A%94%EC%95%BD</guid>
            <pubDate>Sat, 08 Apr 2023 09:56:46 GMT</pubDate>
            <description><![CDATA[<h2 id="버전--에디션-선택-가이드">버전 &amp; 에디션 선택 가이드</h2>
<blockquote>
<p><strong>MySQL 버전 선택 가이드</strong></p>
<p>패치 버전이 15~20번 이상 릴리스된 버전을 골라야합니다.
<span style="color: var(--text3)">ex) MySQL <code>8.0</code> 버전이면 MySQL <code>8.0.15</code> 이상</span></p>
</blockquote>
<ul>
<li>그 이하의 버전에서는 치명적인 버그가 종종 남아있기 때문입니다.</li>
</ul>
<br>

<h4 id="엔터-프라이즈에서만-지원되는-기능서비스-목록">엔터 프라이즈에서만 지원되는 기능/서비스 목록</h4>
<ol>
<li>스레드 풀</li>
<li>Audit, TDE, Authentication</li>
<li>Firewall, Monitor, Backup</li>
<li>기술 지원</li>
</ol>
<br>

<h4 id="mysql-서버-설치-디렉토리">MySQL 서버 설치 디렉토리</h4>
<blockquote>
<p><strong>기본 디렉토리</strong>
<span style="color: var(--text3)">/usr/local/mysql</span></p>
</blockquote>
<table>
<thead>
<tr>
<th>디렉토리</th>
<th>설명</th>
</tr>
</thead>
<tbody><tr>
<td>bin</td>
<td>MySQL 서버와 클라이언트, 유틸리티용</td>
</tr>
<tr>
<td>data</td>
<td>로그, 데이터 파일</td>
</tr>
<tr>
<td>inclue</td>
<td>C/C++ 헤더 파일</td>
</tr>
<tr>
<td>lib</td>
<td>라이브러리 파일</td>
</tr>
<tr>
<td>share</td>
<td>다양한 지원 파일, 에러 메시지, 샘플 설정 파일</td>
</tr>
</tbody></table>
<p><br><br></p>
<hr>
<h2 id="서버-시작종료">서버 시작/종료</h2>
<p><strong>관련 파일</strong></p>
<table>
<thead>
<tr>
<th>파일명</th>
<th>설명</th>
</tr>
</thead>
<tbody><tr>
<td>/etc/my.cnf</td>
<td>MySQL 실행에 필요한 3~4가지 기본 설정 포함</td>
</tr>
<tr>
<td>/var/log/mysqld.log</td>
<td>에러 로그 파일</td>
</tr>
<tr>
<td>/tmp/mysql.sock</td>
<td>MySQL 소켓 파일</td>
</tr>
</tbody></table>
<br>

<h3 id="mysql-서버-시작--종료하기">MySQL 서버 시작 / 종료하기</h3>
<ol>
<li><p>MySQL 설정 파일로 설치를 진행합니다.</p>
</li>
<li><p>터미널에서 mysqld --initialize-insecure 명령어를 실행합니다.</p>
<pre><code class="language-bash">mysqld --defaults-file=/etc/my.cnf --initialize-insecure</code></pre>
<ul>
<li>초기 데이터 파일 생성</li>
<li>트랜잭션 로그 (Redo.log) 생성</li>
<li>root 유저 생성 <span style="color: var(--text3);">(비밀번호 X)</span></li>
<li>생성된 관리자 계정의 비밀번호는 에러 로그 파일에 기록됩니다.</li>
</ul>
</li>
<li><p><code>systemctl</code> 유틸리티로 MySQL 서버를 시작 / 종료 합니다.</p>
<p> <strong>시작</strong></p>
<pre><code class="language-bash"> systemctl start mysqld</code></pre>
<p> <strong>종료</strong></p>
<pre><code class="language-bash"> systemctl stop mysqld</code></pre>
</li>
<li><p><code>mysqld_safe</code> 스크립트로 서버를 시작 / 종료 할 수도 있습니다.</p>
<p> my.cnf의 &quot;[mysqld_safe]&quot; 섹션 설정에 기반해 MySQL 서버를 시작합니다.</p>
</li>
<li><p>MySQL 서버를 셧다운하고 싶다면 다음과 같이 입력합니다.</p>
<pre><code class="language-bash"> mysql&gt; SHUTDOWN;</code></pre>
</li>
</ol>
<br>

<h4 id="트랜잭션-정상-커밋-시-서버-옵션-변경">트랜잭션 정상 커밋 시 서버 옵션 변경</h4>
<blockquote>
<p><strong>클린 셧다운</strong> <span style="color: var(--text3)">(Clean shutdown)</span></p>
<p>MySQL 서버가 종료될 때 모든 커밋된 데이터를 파일에 적용한 뒤 종료하는 것을 말합니다.</p>
</blockquote>
<pre><code class="language-bash">mysql&gt; SET GLOBAL innodb_fast_shutdown=0;
linux&gt; systemctl stop mysqld.service</code></pre>
<pre><code class="language-bash">mysql&gt; SET GLOBAL innodb_fast_shutdown=0;
mysql&gt; SHUTDOWN;</code></pre>
<br>

<h3 id="mysql-서버에-연결하는-3가지-방법">MySQL 서버에 연결하는 3가지 방법</h3>
<ol>
<li><p>Host가 localhost일 때</p>
<ul>
<li><p>항상 소켓 파일을 이용해 접속해야합니다.</p>
</li>
<li><p>IPC인 Unix domain socket을 써서 접속합니다. <span style="color: var(--text3)">(TCP/IP X)</span></p>
<pre><code class="language-bash">mysql -uroot -p --host=localhost --socket=/tmp/mysql.sock</code></pre>
</li>
</ul>
</li>
<li><p>원격 호스트에 있는 MySQL 서버에 접속할 때</p>
<ul>
<li><p>Host를 반드시 127.0.0.1로 지정해야합니다. <span style="color: var(--text3)">(localhost X)</span></p>
</li>
<li><p>이 경우 보통 Port 번호를 적어줍니다.</p>
</li>
<li><p>TCP/IP로 통신합니다.</p>
</li>
<li><p>자기 서버를 가리키는 Loopback IP를 씁니다.</p>
<pre><code class="language-bash">mysql -uroot -p --host=127.0.0.1 --port=3306</code></pre>
</li>
</ul>
</li>
<li><p>Host와 Port를 명시하지 않습니다.</p>
<ul>
<li><p>기본 값은 <code>--host=localhost</code> 이며, 소켓 파일을 사용합니다.</p>
</li>
<li><p>MySQL 서버 설정 파일에서 소켓 파일을 읽어옵니다.</p>
</li>
<li><p>유닉스 소켓 파일은 MySQL 서버가 켜질 때 만들어집니다.</p>
<pre><code class="language-bash">mysql -uroot -p</code></pre>
<br>

</li>
</ul>
</li>
</ol>
<h4 id="원격-mysql-연결-테스트">원격 MySQL 연결 테스트</h4>
<ol>
<li><p>Telnet 프로그램으로 확인하는 방법</p>
<pre><code class="language-bash">telnet 호스트 포트</code></pre>
</li>
<li><p>Netcat 프로그램으로 확인하는 방법</p>
<pre><code class="language-bash">nc 호스트 포트</code></pre>
</li>
</ol>
<p>⇒ 서버가 메시지를 출력한다면 네트워크 연결 상태는 정상입니다.</p>
<br>

<hr>
<h2 id="버전-업그레이드">버전 업그레이드</h2>
<h4 id="인플레이스-업그레이드">인플레이스 업그레이드</h4>
<p><strong>장점</strong></p>
<ul>
<li>업그레이드 시간을 크게 단축할 수 있습니다.</li>
</ul>
<p><strong>단점</strong></p>
<ul>
<li>메이저 버전을 올릴 때는 순차적으로 업그레이드해야합니다.
<span style="color: var(--text3)">ex) <code>5.5</code> → <code>5.7</code> → <code>8.0</code> (<code>5.7</code> 버전을 건너뛸 수 없습니다.)</span></li>
<li>GA 버전이 아니면 다음 메이저 버전으로 업그레이드 할 수 없는 경우도 있습니다.<br>


</li>
</ul>
<h4 id="논리적-업그레이드">논리적 업그레이드</h4>
<p><strong>장점</strong></p>
<ul>
<li>버전 간 제약 사항이 거의 없습니다.</li>
</ul>
<p><strong>단점</strong></p>
<ul>
<li>업그레이드 시간이 매우 많이 걸릴 수 있습니다.
<br><br></li>
</ul>
<hr>
<h3 id="mysql-57-→-80-업그레이드-시-주의-사항">MySQL 5.7 → 8.0 업그레이드 시 주의 사항</h3>
<table>
<thead>
<tr>
<th align="center">주의 항목</th>
<th>설명</th>
</tr>
</thead>
<tbody><tr>
<td align="center">사용자 인증 방식</td>
<td><code>5.0</code> : Native Authentication<br><code>8.0</code> : Caching SHA-2 Authentication<br><span style="color: var(--text3)">인증 방식 유지 옵션 (--default-authentication-plugin=mysql_native_password)</span></td>
</tr>
<tr>
<td align="center">호환성</td>
<td>업그레이드 전 mysqlcheck로 호환성 체크를 진행하세요.<br><span style="color: var(--text3)">(손상된 FRM 파일, 데이터 타입 또는 함수의 호환 여부 확인)</span></td>
</tr>
<tr>
<td align="center">외래키명 길이</td>
<td><code>8.0</code>부터는 외래키명 길이 제한이 64글자로 줄어듭니다.<br>긴 외래키명이 있는지 확인하고 수정하세요.</td>
</tr>
<tr>
<td align="center">인덱스 힌트</td>
<td><code>8.0</code>부터는 인덱스 힌트가 성능 저하를 유발할 수 있으니 꼭 확인하세요.</td>
</tr>
<tr>
<td align="center">Group by 정렬 옵션</td>
<td><code>8.0</code>부터는 GROUP BY절에 ASC, DESC 를 써도 정렬되지 않습니다.</td>
</tr>
<tr>
<td align="center">파티션 <br>테이블스페이스</td>
<td><code>8.0</code>부터는 파티션의 테이블스페이스를 개별 스페이스에 저장해야 합니다.<br><span style="color: var(--text3)">공용 테이블스페이스에 저장할 수 없습니다.</span></td>
</tr>
</tbody></table>
<p><br><br></p>
<hr>
<h2 id="mysql-80-업그레이드">MySQL 8.0 업그레이드</h2>
<p>MySQL <code>5.7</code> → <code>8.0</code> 버전 업그레이드는 총 2단계에 걸쳐 진행됩니다.</p>
<br>

<p><strong>1단계 : 데이터 딕셔너리 업그레이드</strong>를 진행합니다.</p>
<p><code>5.7</code> 에서는 FRM 확장자로 저장됐었는데
<code>8.0</code> 에서는 InnoDB 테이블에 저장되도록 변경돼 트랜잭션이 적용됩니다.</p>
<br>

<p><strong>2단계: MySQL 서버 업그레이드</strong>로 마무리합니다.</p>
<p>시스템 데이터베이스와
<span style="color: var(--text3)">(performance_schema, information_schema, mysql)</span>
테이블 구조가 <code>8.0</code> 버전에 맞게 변경됩니다.</p>
<br>

<h4 id="mysql-8015-이하-버전-업그레이드-절차">MySQL 8.0.15 이하 버전 업그레이드 절차</h4>
<ol>
<li><p>MySQL <span style="color: var(--prism-code-3)"><code>SHUTDOWN</code></span> 시키기</p>
</li>
<li><p>MySQL <code>5.7</code> 삭제 후 → <code>8.0</code> 설치</p>
</li>
<li><p>mysqld로 MySQL <code>8.0</code> 서버  기동
<span style="color: var(--text3)">서버 실행 시 데이터 딕셔너리가 자동 업데이트됩니다.</span></p>
</li>
<li><p>mysql_upgrade 유틸리티 실행
<span style="color: var(--text3)">테이블 구조가 8.0에 맞게 변경됩니다.</span></p>
<br>


</li>
</ol>
<h4 id="mysql-8016-이상-버전-업그레이드-절차">MySQL 8.0.16 이상 버전 업그레이드 절차</h4>
<ol>
<li><p>MySQL <span style="color: var(--prism-code-3)"><code>SHUTDOWN</code></span> 시키기</p>
</li>
<li><p>MySQL <code>5.7</code> 삭제 후 → <code>8.0</code> 설치</p>
</li>
<li><p>mysqld로 MySQL <code>8.0</code> 서버  기동
<span style="color: var(--text3)">서버 실행 시 데이터 딕셔너리뿐만 아니라<br>테이블 구조까지 자동으로 업데이트됩니다.</span></p>
</li>
</ol>
<br>

<blockquote>
<p>왜 이렇게 바뀐걸까요❓</p>
<p><span style="color: var(--text3)">유저들이 mysql_upgrade 유틸리티 실행을 자꾸 까먹어서 그냥 자동화했다고 합니다.</span></p>
</blockquote>
<br>

<hr>
<h2 id="mysql-설정-파일-mycnf">MySQL 설정 파일 (my.cnf)</h2>
<p>Windows에서는 my.ini 파일로 설정합니다.</p>
<br>

<h4 id="특징">특징</h4>
<ol>
<li>MySQL 서버를 시작할 때만 → 설정 파일을 참조합니다.</li>
<li>설치 방법에 따라 설정 파일을 읽어오는 경로가 달라집니다.</li>
</ol>
<br>

<h4 id="설정-파일-참조-경로">설정 파일 참조 경로</h4>
<pre><code class="language-bash"># 설정 파일 참조 경로 확인 명령어
mysqld --verbose --help</code></pre>
<p>위 명령어를 실행하면
아래와 같이 설정 파일 참조 순서에 따라 참조 경로를 출력합니다.</p>
<pre><code class="language-bash"># 출력
...
/etc/my.cnf /etc/mysql/my.cnf /usr/etc/my.cnf ~/.my.cnf
...</code></pre>
<ul>
<li><p>LTR <span style="color: var(--text3)">(Left to Right)</span> 방향으로 참조가 일어납니다.</p>
</li>
<li><p>1, 2, 4번 경로는 고정적으로 동일합니다.</p>
</li>
<li><p>3번째 경로 <code>/usr/etc/my.cnf</code> 는 컴파일될 때 결정되므로, 사용자마다 달라질 수 있습니다.</p>
<br>

</li>
</ul>
<h4 id="mycnf-파일의-형식">my.cnf 파일의 형식</h4>
<br>
주요 구성요소는 다음과 같습니다.

<ul>
<li>[설정 그룹]</li>
<li>key = value</li>
</ul>
<p>위 요소들을 이용해
하나의 파일에 여러 개의 설정 그룹을 만들 수 있습니다.
<br></p>
<pre><code class="language-bash">[mysqld] # 설정 그룹
socket = /usr/local/mysql/tmp/mysql.sock
port = 3306

[mysql]
default-character-set = utf8mb4
socket = /usr/local/mysql/tmp/mysql.sock
port = 3304

[mysqldump]
default-character-set = utf8mb4
socket = /usr/local/mysql/tmp/mysql.sock
port = 3305</code></pre>
<br>

<h3 id="mysql-시스템-변수">MySQL 시스템 변수</h3>
<p><strong>시스템 변수 확인 방법</strong></p>
<pre><code class="language-sql">SHOW GLOBAL VARIABLES;</code></pre>
<br>

<p><strong>시스템 변수 속성 목록표</strong></p>
<table>
<thead>
<tr>
<th align="center">속성명</th>
<th>설명</th>
</tr>
</thead>
<tbody><tr>
<td align="center"><strong>Cmd-Line</strong></td>
<td>커맨드 라인으로 설정할 수 있는 옵션인지?</td>
</tr>
<tr>
<td align="center"><strong>Option File</strong></td>
<td>my.cnf로 제어할 수 있는 옵션인지?</td>
</tr>
<tr>
<td align="center"><strong>System Var</strong></td>
<td>시스템 변수인지?</td>
</tr>
<tr>
<td align="center"><strong>Var Scope</strong></td>
<td>옵션의 영향 범위는 어디까지인지?<br><span style="color: var(--text3)">Global, Session, Both</span></td>
</tr>
<tr>
<td align="center"><strong>Dynamic</strong></td>
<td>동적 시스템 변수인지?</td>
</tr>
</tbody></table>
<br>

<p><strong>변수 스코프 상세 설명</strong></p>
<ol>
<li><p>글로벌 변수</p>
<p> 한 대의 MySQL 서버 인스턴스 전체 범위에 영향을 미칩니다.</p>
<ul>
<li>MySQL 서버 설정 관련 변수가 많습니다.
<span style="color: var(--text3)">ex) innodb_buffer_pool_size, key_buffer_size</span><br>
</li>
</ul>
</li>
<li><p>세션 변수</p>
<p> 오직 현재 클라이언트의 커넥션에만 영향을 미칩니다.</p>
<ul>
<li>MySQL 개별 클라이언트가 갖는 옵션 기본 값을 설정합니다.
<span style="color: var(--text3)">ex) autocommit = ON/OFF</span><br></li>
<li>커넥션별로 값을 다르게 지정할 수 있습니다.<br></li>
<li>한 번 연결된 커넥션의 세션 변수를 서버 측에서 강제로 변경할 수 없습니다.<br>
</li>
</ul>
</li>
<li><p>Both</p>
<p> 값 변경 시 범위를 명시해줘야 합니다.</p>
<ul>
<li>Global인지 Session인지</li>
</ul>
</li>
</ol>
<br>

<p><strong>정적 변수와 동적 변수 설명</strong></p>
<br>
MySQL 서버가 돌아가고 있을 때

<p>수정 가능하면? &nbsp;&nbsp;&nbsp;<strong>동적 변수</strong>
그렇지 않으면? &nbsp;&nbsp;&nbsp;<strong>정적 변수</strong> 입니다.
<br></p>
<ul>
<li><p>my.cnf 변경은 서버를 재시작할 때까지 반영되지 않습니다.</p>
</li>
<li><p>MySQL 서버 메모리 상의 변수를 수정하면 즉각 반영됩니다.
<span style="color: var(--text3)">🚨 단, 서버의 현재 인스턴스에만 적용되고 재시작 시 변경 사항이 날아갑니다.</span></p>
<p>변경사항을 반영하려면 <code>SET PERSIST</code> 명령을 이용해 my.cnf 파일에 기록해야합니다.</p>
</li>
</ul>
<pre><code class="language-sql"># 예시
SET GLOBAL max_sonnections=500; # 글로벌 시스템 변수 변경

SHOW GLOBAL VARIABLES LIKE &#39;%max_connections%&#39; # 변경된 값 조회

SET PERSIST max_connections=500; # 변경 사항을 my.cnf 파일에 반영</code></pre>
<ul>
<li>MB, GB 같은 단위 대신 SET 명령에 1024*1024 같은 수식을 사용할 수 있습니다.</li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[[비동기] 🎯 콜백 함수가 뭔가요?]]></title>
            <link>https://velog.io/@m-dzn/%EB%B9%84%EB%8F%99%EA%B8%B0-%EC%BD%9C%EB%B0%B1-%ED%95%A8%EC%88%98%EA%B0%80-%EB%AD%94%EA%B0%80%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EB%B9%84%EB%8F%99%EA%B8%B0-%EC%BD%9C%EB%B0%B1-%ED%95%A8%EC%88%98%EA%B0%80-%EB%AD%94%EA%B0%80%EC%9A%94</guid>
            <pubDate>Tue, 07 Jun 2022 08:30:53 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="✅-개념">✅ 개념</h3>
<blockquote>
<h3 id="💡-콜백-함수-callback-function">💡 콜백 함수 (Callback Function)</h3>
</blockquote>
<table>
<thead>
<tr>
<th align="center">구성</th>
<th>설명</th>
</tr>
</thead>
<tbody><tr>
<td align="center"><strong>어떻게?</strong></td>
<td>매개변수로 전달되어</td>
</tr>
<tr>
<td align="center">🎯</td>
<td>다른 함수의 내부에서 실행되는 함수를 말합니다.</td>
</tr>
</tbody></table>
<br>

<h3 id="⬛-특징">⬛ 특징</h3>
<ol>
<li>⬛ 콜백 함수는 언제 실행되고 언제 결과가 반환될지 알 수 없기 때문에 비동기적으로 처리됩니다.</li>
</ol>
]]></description>
        </item>
        <item>
            <title><![CDATA[[이터러블] 🎯 구조 분해 할당이 뭔가요?]]></title>
            <link>https://velog.io/@m-dzn/%EC%9D%B4%ED%84%B0%EB%9F%AC%EB%B8%94-%EA%B5%AC%EC%A1%B0-%EB%B6%84%ED%95%B4-%ED%95%A0%EB%8B%B9%EC%9D%B4-%EB%AD%94%EA%B0%80%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EC%9D%B4%ED%84%B0%EB%9F%AC%EB%B8%94-%EA%B5%AC%EC%A1%B0-%EB%B6%84%ED%95%B4-%ED%95%A0%EB%8B%B9%EC%9D%B4-%EB%AD%94%EA%B0%80%EC%9A%94</guid>
            <pubDate>Tue, 07 Jun 2022 08:15:43 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-개념">⬛ 개념</h3>
<blockquote>
<h3 id="💡-구조-분해-할당-destructuring-assignment">💡 구조 분해 할당 (Destructuring Assignment)</h3>
<p>이터러블 또는 객체의 구조를 파괴해 여러 변수에 나눠 할당하는 것을 말합니다.</p>
</blockquote>
<br>

<h3 id="⬛-특징">⬛ 특징</h3>
<ol>
<li>⬛ 기존 배열, 객체에서 필요한 값만 추출해 사용할 수 있습니다.</li>
<li>⬛ 새 배열을 만들 때도 유용합니다.</li>
</ol>
]]></description>
        </item>
        <item>
            <title><![CDATA[[객체] 🎯 전역 객체에 대해 아나요?]]></title>
            <link>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EC%A0%84%EC%97%AD-%EA%B0%9D%EC%B2%B4%EC%97%90-%EB%8C%80%ED%95%B4-%EC%95%84%EB%82%98%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EC%A0%84%EC%97%AD-%EA%B0%9D%EC%B2%B4%EC%97%90-%EB%8C%80%ED%95%B4-%EC%95%84%EB%82%98%EC%9A%94</guid>
            <pubDate>Tue, 07 Jun 2022 08:07:31 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-특징">⬛ 특징</h3>
<ol>
<li>⬛ 코드가 실행되기 전에 JS 엔진이 생성하는 특수한 객체입니다.</li>
<li>⬛ 클라이언트 사이드 환경 <span style="color: var(--text3)">(브라우저)</span> 에서는 <code>window</code> 객체입니다.</li>
<li>⬛ 서버 사이드 환경 <span style="color: var(--text3)">(Node.js)</span> 에서는 <code>global</code> 객체가 전역 객체입니다.</li>
</ol>
]]></description>
        </item>
        <item>
            <title><![CDATA[[객체] 🎯 생성자 함수가 객체를 생성하는 과정을 간략히 설명해주세요]]></title>
            <link>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EC%83%9D%EC%84%B1%EC%9E%90-%ED%95%A8%EC%88%98%EA%B0%80-%EA%B0%9D%EC%B2%B4%EB%A5%BC-%EC%83%9D%EC%84%B1%ED%95%98%EB%8A%94-%EA%B3%BC%EC%A0%95%EC%9D%84-%EA%B0%84%EB%9E%B5%ED%9E%88-%EC%84%A4%EB%AA%85%ED%95%B4%EC%A3%BC%EC%84%B8%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EC%83%9D%EC%84%B1%EC%9E%90-%ED%95%A8%EC%88%98%EA%B0%80-%EA%B0%9D%EC%B2%B4%EB%A5%BC-%EC%83%9D%EC%84%B1%ED%95%98%EB%8A%94-%EA%B3%BC%EC%A0%95%EC%9D%84-%EA%B0%84%EB%9E%B5%ED%9E%88-%EC%84%A4%EB%AA%85%ED%95%B4%EC%A3%BC%EC%84%B8%EC%9A%94</guid>
            <pubDate>Tue, 07 Jun 2022 07:56:44 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-과정">⬛ 과정</h3>
<ol>
<li><p>⬛ 생성자 함수를 선언합니다.
 생성자 함수 안의 <code>this.프로퍼티</code> 에 속성 및 메소드를 할당합니다.</p>
</li>
<li><p>✅ new 연산자로 인스턴스를 생성합니다.</p>
</li>
<li><p>✅ 생성자 함수 선언 시 작성된대로 인스턴스가 초기화됩니다.</p>
</li>
<li><p>✅ 인스턴스의 this가 반환됩니다.</p>
</li>
</ol>
]]></description>
        </item>
        <item>
            <title><![CDATA[[객체] 🎯 객체 리터럴과 생성자 함수의 차이는 무엇인가요?]]></title>
            <link>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EA%B0%9D%EC%B2%B4-%EB%A6%AC%ED%84%B0%EB%9F%B4%EA%B3%BC-%EC%83%9D%EC%84%B1%EC%9E%90-%ED%95%A8%EC%88%98%EC%9D%98-%EC%B0%A8%EC%9D%B4%EB%8A%94-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EA%B0%9D%EC%B2%B4-%EB%A6%AC%ED%84%B0%EB%9F%B4%EA%B3%BC-%EC%83%9D%EC%84%B1%EC%9E%90-%ED%95%A8%EC%88%98%EC%9D%98-%EC%B0%A8%EC%9D%B4%EB%8A%94-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80%EC%9A%94</guid>
            <pubDate>Tue, 07 Jun 2022 07:51:02 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="✅-비교">✅ 비교</h3>
<h4 id="✅-리터럴">✅ 리터럴</h4>
<p>단 하나의 객체만 생성하며, 비슷한 객체를 여러 개 찍어낼 수 없어 비효율적입니다.</p>
<h4 id="✅-생성자-함수">✅ 생성자 함수</h4>
<p>템플릿처럼 여러 개의 유사한 객체를 손쉽게 찍어낼 수 있습니다.</p>
]]></description>
        </item>
        <item>
            <title><![CDATA[[객체] 🎯 생성자 함수가 뭔가요?]]></title>
            <link>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EC%83%9D%EC%84%B1%EC%9E%90-%ED%95%A8%EC%88%98%EA%B0%80-%EB%AD%94%EA%B0%80%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EC%83%9D%EC%84%B1%EC%9E%90-%ED%95%A8%EC%88%98%EA%B0%80-%EB%AD%94%EA%B0%80%EC%9A%94</guid>
            <pubDate>Tue, 07 Jun 2022 07:47:59 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="✅-개념">✅ 개념</h3>
<blockquote>
<h3 id="💡-생성자-함수-contructor">💡 생성자 함수 (Contructor)</h3>
<p>객체를 생성하는 함수입니다.</p>
</blockquote>
<br>

<h3 id="⬛-특징">⬛ 특징</h3>
<ol>
<li>✅ 객체를 생성할 때 반드시 new 연산자로 호출합니다.</li>
<li>⬛ 함수명은 파스칼 케이스로 작성합니다.</li>
<li>⬛ ⭐ return을 작성하지 않으면 this를 반환합니다.
 <span style="color: var(--text3)">3-1. 원시형 데이터를 return하면 무시하고 this를 반환합니다.</span>
 <span style="color: var(--text3)">3-2. 참조형 데이터를 return하면 this 대신 해당 참조형 데이터를 반환합니다.</span></li>
</ol>
<br>

<h3 id="⬛-빌트인-생성자-함수">⬛ 빌트인 생성자 함수</h3>
<ol>
<li>✅ String</li>
<li>✅ Number</li>
<li>✅ Boolean</li>
<li>⬛ Function</li>
<li>⬛ Array</li>
<li>⬛ Date</li>
<li>⬛ RegExp</li>
<li>⬛ Promise</li>
</ol>
]]></description>
        </item>
        <item>
            <title><![CDATA[[객체] 🎯 빌트인 객체가 뭔가요?]]></title>
            <link>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EB%B9%8C%ED%8A%B8%EC%9D%B8-%EA%B0%9D%EC%B2%B4%EA%B0%80-%EB%AD%94%EA%B0%80%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EB%B9%8C%ED%8A%B8%EC%9D%B8-%EA%B0%9D%EC%B2%B4%EA%B0%80-%EB%AD%94%EA%B0%80%EC%9A%94</guid>
            <pubDate>Tue, 07 Jun 2022 07:21:10 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="✅-개념">✅ 개념</h3>
<blockquote>
<h3 id="💡-빌트인-객체-built-in-object">💡 빌트인 객체 (Built-in Object)</h3>
<p>JS에서 사전에 준비해서 제공해주는 객체를 말합니다.</p>
</blockquote>
<p>≒ <span style="color: var(--prism-code-8)"><code>네이티브 객체</code></span>&nbsp; <span style="color: var(--prism-code-3)"><code>Global 객체</code></span></p>
<br>

<h3 id="⬛-객체의-종류">⬛ 객체의 종류</h3>
<ol>
<li><p>⬛ 표준 빌트인 객체
 ECMAScript 사양에 정의된 객체</p>
</li>
<li><p>⬛ 호스트 객체
 JS 런타임이 추가로 제공하는 객체</p>
</li>
<li><p>⬛ 사용자 정의 객체
 사용자가 직접 정의한 객체</p>
</li>
</ol>
]]></description>
        </item>
        <item>
            <title><![CDATA[[객체] 🎯 래퍼 객체에 대해 알고 있나요?]]></title>
            <link>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EB%9E%98%ED%8D%BC-%EA%B0%9D%EC%B2%B4%EC%97%90-%EB%8C%80%ED%95%B4-%EC%95%8C%EA%B3%A0-%EC%9E%88%EB%82%98%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EB%9E%98%ED%8D%BC-%EA%B0%9D%EC%B2%B4%EC%97%90-%EB%8C%80%ED%95%B4-%EC%95%8C%EA%B3%A0-%EC%9E%88%EB%82%98%EC%9A%94</guid>
            <pubDate>Tue, 07 Jun 2022 05:17:18 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-개념">⬛ 개념</h3>
<blockquote>
<h3 id="💡-래퍼-객체-wrapper--object">💡 래퍼 객체 (Wrapper  Object)</h3>
<p>원시 타입을 객체 타입처럼 사용하기 위해 감싼 객체입니다.</p>
</blockquote>
<br>

<h3 id="⬛-특징">⬛ 특징</h3>
<ol>
<li><p>⬛ <code>래퍼객체.length</code> 처럼 원시타입의 프로퍼티에 접근하면 <code>new 래퍼객체</code> 를 호출한 것처럼 문자열 값을 객체로 변환합니다.</p>
</li>
<li><p>⬛ 원시 값의 프로퍼티 참조 시 생성되고, 프로퍼티 참조가 끝나면 사라집니다.</p>
</li>
<li><p>⬛ 원시 타입과 래퍼 객체 사이에는 느슨한 타입 비교가 적용됩니다.
 <code>==</code> 로 비교하면 같다고 나오고, <code>===</code> 로 비교하면 다르다고 나옵니다.</p>
</li>
</ol>
<br>

<h3 id="⬛-종류">⬛ 종류</h3>
<ol>
<li>⬛ Number ↔ number</li>
<li>⬛ String ↔ string</li>
<li>⬛ Boolean ↔ boolean</li>
<li>⬛ Symbol ↔ symbol</li>
</ol>
]]></description>
        </item>
        <item>
            <title><![CDATA[[객체] 🎯 JS에 클래스가 생기기 전에는 어떻게 OOP를 구현했나요?]]></title>
            <link>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-JS%EC%97%90-%ED%81%B4%EB%9E%98%EC%8A%A4%EA%B0%80-%EC%83%9D%EA%B8%B0%EA%B8%B0-%EC%A0%84%EC%97%90%EB%8A%94-%EC%96%B4%EB%96%BB%EA%B2%8C-OOP%EB%A5%BC-%EA%B5%AC%ED%98%84%ED%96%88%EB%82%98%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-JS%EC%97%90-%ED%81%B4%EB%9E%98%EC%8A%A4%EA%B0%80-%EC%83%9D%EA%B8%B0%EA%B8%B0-%EC%A0%84%EC%97%90%EB%8A%94-%EC%96%B4%EB%96%BB%EA%B2%8C-OOP%EB%A5%BC-%EA%B5%AC%ED%98%84%ED%96%88%EB%82%98%EC%9A%94</guid>
            <pubDate>Tue, 07 Jun 2022 04:38:25 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-설명">⬛ 설명</h3>
<p>생성자 함수와 프로토타입을 이용해 OOP를 구현했습니다.</p>
<ul>
<li>생성자 함수는 내부에서 this.프로퍼티 값을 할당하는 함수를 말합니다.</li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[[객체] 🎯 생성자 함수와 클래스의 차이는 뭔가요?]]></title>
            <link>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EC%83%9D%EC%84%B1%EC%9E%90-%ED%95%A8%EC%88%98%EC%99%80-%ED%81%B4%EB%9E%98%EC%8A%A4%EC%9D%98-%EC%B0%A8%EC%9D%B4%EB%8A%94-%EB%AD%94%EA%B0%80%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%EC%83%9D%EC%84%B1%EC%9E%90-%ED%95%A8%EC%88%98%EC%99%80-%ED%81%B4%EB%9E%98%EC%8A%A4%EC%9D%98-%EC%B0%A8%EC%9D%B4%EB%8A%94-%EB%AD%94%EA%B0%80%EC%9A%94</guid>
            <pubDate>Mon, 06 Jun 2022 21:19:36 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-차이점">⬛ 차이점</h3>
<table>
<thead>
<tr>
<th align="center">✅</th>
<th align="center">구분</th>
<th>클래스</th>
<th>생성자 함수</th>
</tr>
</thead>
<tbody><tr>
<td align="center"></td>
<td align="center">호출</td>
<td>new 연산자로 호출<br><span style="color: var(--text3)">(일반 함수 호출 시 에러)</span></td>
<td>new 연산자로 호출<br>일반 함수로도 호출 가능</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">extends 키워드</td>
<td>✅</td>
<td>❌</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">super 키워드</td>
<td>✅</td>
<td>❌</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">호이스팅</td>
<td>❌</td>
<td>✅</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">strict mode</td>
<td>항상 자동 적용되며<br>해제 불가</td>
<td>자동 적용 x<br>직접 적용해야함</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">[[Enumerable]]</td>
<td>enumerable 플래그가 false로<br>for .. in 순회 시 열거 x<br><span style="color: var(--text3)">ex) constructor,<br>prototype 메소드,<br>정적 메소드는 순회 시 제외</span></td>
<td></td>
</tr>
<tr>
<td align="center"></td>
<td align="center">[[IsClassConstructor]]</td>
<td>true</td>
<td></td>
</tr>
</tbody></table>
<ul>
<li><span style="color: var(--text3)"><strong>[[IsClassConstructor]]</strong>
  ① 클래스 생성자를 new와 함께 호출하지 않으면 에러가 발생하는 이유
  ② 클래스 생성자를 문자열로 형변환했을 때 &#39;class...&#39;로 시작하는 이유</span></li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[[객체] 🎯 클래스의 상속과 프로토타입의 상속은 어떻게 다른가요?]]></title>
            <link>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%ED%81%B4%EB%9E%98%EC%8A%A4%EC%9D%98-%EC%83%81%EC%86%8D%EA%B3%BC-%ED%94%84%EB%A1%9C%ED%86%A0%ED%83%80%EC%9E%85%EC%9D%98-%EC%83%81%EC%86%8D%EC%9D%80-%EC%96%B4%EB%96%BB%EA%B2%8C-%EB%8B%A4%EB%A5%B8%EA%B0%80%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EA%B0%9D%EC%B2%B4-%ED%81%B4%EB%9E%98%EC%8A%A4%EC%9D%98-%EC%83%81%EC%86%8D%EA%B3%BC-%ED%94%84%EB%A1%9C%ED%86%A0%ED%83%80%EC%9E%85%EC%9D%98-%EC%83%81%EC%86%8D%EC%9D%80-%EC%96%B4%EB%96%BB%EA%B2%8C-%EB%8B%A4%EB%A5%B8%EA%B0%80%EC%9A%94</guid>
            <pubDate>Mon, 06 Jun 2022 15:05:12 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-비교">⬛ 비교</h3>
<table>
<thead>
<tr>
<th align="center">✅</th>
<th align="center">구분</th>
<th>프로토타입<br>기반 상속</th>
<th>클래스<br>기반 상속</th>
</tr>
</thead>
<tbody><tr>
<td align="center"></td>
<td align="center">개념</td>
<td>인스턴스</td>
<td>설계도</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">런타임</td>
<td>유연해서 가변</td>
<td>런타임에 불변</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">다중 상속</td>
<td>❌</td>
<td>❌</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">상속 복잡도</td>
<td>단순<br>프로토타입 체인</td>
<td>복잡<br>추상 클래스, final 클래스<br>인터페이스 등</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">상속 방식</td>
<td>프로토타입 체이닝</td>
<td>클래스 확장 정의</td>
</tr>
</tbody></table>
]]></description>
        </item>
        <item>
            <title><![CDATA[[함수] 🎯 JS에서 함수를 정의하는 방법은 몇가지인가요?]]></title>
            <link>https://velog.io/@m-dzn/%ED%95%A8%EC%88%98-JS%EC%97%90%EC%84%9C-%ED%95%A8%EC%88%98%EB%A5%BC-%EC%A0%95%EC%9D%98%ED%95%98%EB%8A%94-%EB%B0%A9%EB%B2%95%EC%9D%80-%EB%AA%87%EA%B0%80%EC%A7%80%EC%9D%B8%EA%B0%80%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%ED%95%A8%EC%88%98-JS%EC%97%90%EC%84%9C-%ED%95%A8%EC%88%98%EB%A5%BC-%EC%A0%95%EC%9D%98%ED%95%98%EB%8A%94-%EB%B0%A9%EB%B2%95%EC%9D%80-%EB%AA%87%EA%B0%80%EC%A7%80%EC%9D%B8%EA%B0%80%EC%9A%94</guid>
            <pubDate>Mon, 06 Jun 2022 13:26:36 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-종류">⬛ 종류</h3>
<ol>
<li>⬛ 함수 선언문</li>
<li>⬛ 함수 표현식</li>
<li>⬛ new Function 생성자 함수</li>
<li>⬛ 화살표 함수</li>
</ol>
]]></description>
        </item>
        <item>
            <title><![CDATA[[함수] 🎯 함수 선언문과 함수 표현식의 차이는 뭔가요?]]></title>
            <link>https://velog.io/@m-dzn/%ED%95%A8%EC%88%98-%ED%95%A8%EC%88%98-%EC%84%A0%EC%96%B8%EB%AC%B8%EA%B3%BC-%ED%95%A8%EC%88%98-%ED%91%9C%ED%98%84%EC%8B%9D%EC%9D%98-%EC%B0%A8%EC%9D%B4%EB%8A%94-%EB%AD%94%EA%B0%80%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%ED%95%A8%EC%88%98-%ED%95%A8%EC%88%98-%EC%84%A0%EC%96%B8%EB%AC%B8%EA%B3%BC-%ED%95%A8%EC%88%98-%ED%91%9C%ED%98%84%EC%8B%9D%EC%9D%98-%EC%B0%A8%EC%9D%B4%EB%8A%94-%EB%AD%94%EA%B0%80%EC%9A%94</guid>
            <pubDate>Mon, 06 Jun 2022 13:24:32 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-개념">⬛ 개념</h3>
<blockquote>
<h4 id="💡-함수-선언문">💡 함수 선언문</h4>
<p>function 키워드로 선언한 일반 함수 선언문</p>
</blockquote>
<pre><code class="language-javascript">function add(a, b) {
  return a + b;
}</code></pre>
<br>

<blockquote>
<h4 id="💡-함수-표현식">💡 함수 표현식</h4>
<p>함수가 일급 객체라는 점을 이용해 변수에 저장한 뒤 사용</p>
</blockquote>
<pre><code class="language-javascript">const add = function (a, b) {
      return a + b;
}</code></pre>
<br>

<h3 id="⬛-비교-표">⬛ 비교 표</h3>
<table>
<thead>
<tr>
<th align="center">✅</th>
<th align="center">구분</th>
<th>함수 선언문</th>
<th>함수 표현식</th>
</tr>
</thead>
<tbody><tr>
<td align="center"></td>
<td align="center">호이스팅</td>
<td>✅</td>
<td>❌</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">식별자 생성 시점</td>
<td>🅰 Creation Phase</td>
<td>🅰 Creation Phase</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">함수 생성 시점</td>
<td>🅰 Creation Phase</td>
<td>🅱 Execution Phase <span style="color: var(--text3)">(할당 시)</span></td>
</tr>
<tr>
<td align="center"></td>
<td align="center">블록 스코프 밖으로<br>가져나가기</td>
<td>❌</td>
<td>✅</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">기타</td>
<td></td>
<td>const, let → TDZ 존재<br>var → 할당 전에는 undefined</td>
</tr>
</tbody></table>
]]></description>
        </item>
        <item>
            <title><![CDATA[[함수] 🎯 일급 객체가 뭔가요?]]></title>
            <link>https://velog.io/@m-dzn/%ED%95%A8%EC%88%98-%EC%9D%BC%EA%B8%89-%EA%B0%9D%EC%B2%B4%EA%B0%80-%EB%AD%94%EA%B0%80%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%ED%95%A8%EC%88%98-%EC%9D%BC%EA%B8%89-%EA%B0%9D%EC%B2%B4%EA%B0%80-%EB%AD%94%EA%B0%80%EC%9A%94</guid>
            <pubDate>Mon, 06 Jun 2022 13:13:50 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="✅-개념">✅ 개념</h3>
<blockquote>
<h3 id="💡-일급-객체-first-class-object">💡 일급 객체 (First-class Object)</h3>
<p>값으로 다룰 수 있는 객체를 말합니다.</p>
</blockquote>
<br>

<h3 id="⬛-조건">⬛ 조건</h3>
<ol>
<li>⬛ 익명으로 생성할 수 있어야 합니다.</li>
<li>✅ 변수나 자료구조에 할당할 수 있어야 합니다.</li>
<li>✅ 함수의 인자로 넘길 수 있어야 합니다.</li>
<li>✅ 함수의 리턴 값으로 반환될 수 있어야 합니다.</li>
</ol>
]]></description>
        </item>
        <item>
            <title><![CDATA[[함수] 🎯 순수 함수와 비순수 함수에는 어떤 차이가 있나요?]]></title>
            <link>https://velog.io/@m-dzn/%ED%95%A8%EC%88%98-%EC%88%9C%EC%88%98-%ED%95%A8%EC%88%98%EC%99%80-%EB%B9%84%EC%88%9C%EC%88%98-%ED%95%A8%EC%88%98%EC%97%90%EB%8A%94-%EC%96%B4%EB%96%A4-%EC%B0%A8%EC%9D%B4%EA%B0%80-%EC%9E%88%EB%82%98%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%ED%95%A8%EC%88%98-%EC%88%9C%EC%88%98-%ED%95%A8%EC%88%98%EC%99%80-%EB%B9%84%EC%88%9C%EC%88%98-%ED%95%A8%EC%88%98%EC%97%90%EB%8A%94-%EC%96%B4%EB%96%A4-%EC%B0%A8%EC%9D%B4%EA%B0%80-%EC%9E%88%EB%82%98%EC%9A%94</guid>
            <pubDate>Mon, 06 Jun 2022 13:05:54 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-개념">⬛ 개념</h3>
<blockquote>
<h3 id="💡-순수-함수">💡 순수 함수</h3>
<p>외부 상태에 의존하지 않고 이를 변경하지도 않아 사이드 이펙트를 걱정할 필요가 없는 함수입니다.</p>
</blockquote>
<blockquote>
<h3 id="💡-비순수-함수">💡 비순수 함수</h3>
<p>외부 상태에 의존하거나 이를 변경해 사이트 이펙트를 발생시킬 수 있는 함수입니다.</p>
</blockquote>
<br>

<h3 id="⬛-비교">⬛ 비교</h3>
<table>
<thead>
<tr>
<th align="center">✅</th>
<th align="center">구분</th>
<th>순수 함수</th>
<th>비순수 함수</th>
</tr>
</thead>
<tbody><tr>
<td align="center"></td>
<td align="center">입력 및 반환값</td>
<td>같은 입력을 받았을 때<br>같은 값을 반환합니다.</td>
<td>같은 입력을 받아도<br>반환되는 값이 달라질 수 있습니다.</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">테스트</td>
<td>용이함</td>
<td>어려움</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">전역변수</td>
<td>사용하지 않습니다.</td>
<td>전역변수를 사용하며,<br>버그 발생의 주요 원인 중 하나입니다.</td>
</tr>
</tbody></table>
<ul>
<li>같은 입력에 출력이 달라지는 함수는 조건을 설정하기 어려워 테스트하기가 어렵습니다.</li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[[이터러블] 🎯 스프레드 연산자와 Rest 파라미터의 차이는 뭔가요?]]></title>
            <link>https://velog.io/@m-dzn/%EC%9D%B4%ED%84%B0%EB%9F%AC%EB%B8%94-%EC%8A%A4%ED%94%84%EB%A0%88%EB%93%9C-%EC%97%B0%EC%82%B0%EC%9E%90%EC%99%80-Rest-%ED%8C%8C%EB%9D%BC%EB%AF%B8%ED%84%B0%EC%9D%98-%EC%B0%A8%EC%9D%B4%EB%8A%94-%EB%AD%94%EA%B0%80%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EC%9D%B4%ED%84%B0%EB%9F%AC%EB%B8%94-%EC%8A%A4%ED%94%84%EB%A0%88%EB%93%9C-%EC%97%B0%EC%82%B0%EC%9E%90%EC%99%80-Rest-%ED%8C%8C%EB%9D%BC%EB%AF%B8%ED%84%B0%EC%9D%98-%EC%B0%A8%EC%9D%B4%EB%8A%94-%EB%AD%94%EA%B0%80%EC%9A%94</guid>
            <pubDate>Mon, 06 Jun 2022 12:48:03 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-개념">⬛ 개념</h3>
<blockquote>
<h3 id="💡-전개-연산자-spread-operator">💡 <strong>전개 연산자 (Spread Operator)</strong></h3>
<p>Iterable한 객체를 개별 요소로 하나씩 분리해서 펼칠 때 사용하는 문법입니다.</p>
</blockquote>
<br>

<blockquote>
<h3 id="💡-rest-파라미터-rest-parameter">💡 <strong>Rest 파라미터 (Rest parameter)</strong></h3>
<p>여러 개의 가변 인자 목록을 하나의 배열로 가져오는 문법입니다.</p>
</blockquote>
<br>

<h3 id="⬛-비교-표">⬛ 비교 표</h3>
<table>
<thead>
<tr>
<th></th>
<th>Spread 연산자</th>
<th>Rest 파라미터</th>
</tr>
</thead>
<tbody><tr>
<td>행위</td>
<td>✅ 하나의 배열을 개별 요소로 펼칩니다.<br>(1 to N)</td>
<td>✅ 여러 인자를 하나의 배열로 반환합니다.<br>(N to 1)</td>
</tr>
<tr>
<td>활용</td>
<td>✅ 배열/객체를 합칠 때<br>✅ 배열/객체를 복사할 때</td>
<td>✅ 가변 인자를 배열로 받아올 때<br>⬛ 비구조화할당 시 나머지 요소를 배열로 묶어 가져올 때</td>
</tr>
</tbody></table>
<br>

<h3 id="⬛-주의점">⬛ 주의점</h3>
<ol>
<li>⬛ 스프레드 연산자로 객체/배열 생성 시 얕은 복사가 이루어집니다.</li>
</ol>
]]></description>
        </item>
        <item>
            <title><![CDATA[[배열] 🎯 배열 메소드에는 어떤게 있나요?]]></title>
            <link>https://velog.io/@m-dzn/%EB%B0%B0%EC%97%B4-%EB%B0%B0%EC%97%B4-%EB%A9%94%EC%86%8C%EB%93%9C%EC%97%90%EB%8A%94-%EC%96%B4%EB%96%A4%EA%B2%8C-%EC%9E%88%EB%82%98%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EB%B0%B0%EC%97%B4-%EB%B0%B0%EC%97%B4-%EB%A9%94%EC%86%8C%EB%93%9C%EC%97%90%EB%8A%94-%EC%96%B4%EB%96%A4%EA%B2%8C-%EC%9E%88%EB%82%98%EC%9A%94</guid>
            <pubDate>Mon, 06 Jun 2022 12:40:53 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-종류">⬛ 종류</h3>
<h4 id="불변-span-stylecolor-var--text3immutablespan-메소드">불변 <span style="color: var(--text3)">(Immutable)</span> 메소드</h4>
<pre><code class="language-javascript">Array.isArray() // 인자가 Array 타입인지 확인 ✅
arr.indexOf() // n번째 인덱스 조회
arr.concat() // 기존 배열과 파라미터의 값들을 합쳐 새 배열 반환
arr.slice() // 배열의 일부를 잘라 새 부분 배열로 반환
arr.includes() // 배열이 특정 요소를 포함하고 있는지 확인</code></pre>
<h4 id="가변-span-stylecolor-var--text3mutablespan-메소드">가변 <span style="color: var(--text3)">(Mutable)</span> 메소드</h4>
<pre><code class="language-javascript">arr.join() // 배열 원소를 하나의 문자열로 합치기 ✅
arr.fill() // 배열 처음부터 끝까지 같은 값으로 채우기
arr.reverse() // 배열 순서 거꾸로 뒤집기
arr.push() // 배열 원소 추가 ✅
arr.pop() // 배열 원소 제거 ✅
arr.shift() // 배열 맨 처음 원소 제거
arr.unshift() // 배열 맨 앞에 원소 추가</code></pre>
]]></description>
        </item>
        <item>
            <title><![CDATA[[배열] 🎯 JS의 배열은 자료구조의 배열과 같나요?]]></title>
            <link>https://velog.io/@m-dzn/%EB%B0%B0%EC%97%B4-JS%EC%9D%98-%EB%B0%B0%EC%97%B4%EC%9D%80-%EC%9E%90%EB%A3%8C%EA%B5%AC%EC%A1%B0%EC%9D%98-%EB%B0%B0%EC%97%B4%EA%B3%BC-%EA%B0%99%EB%82%98%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EB%B0%B0%EC%97%B4-JS%EC%9D%98-%EB%B0%B0%EC%97%B4%EC%9D%80-%EC%9E%90%EB%A3%8C%EA%B5%AC%EC%A1%B0%EC%9D%98-%EB%B0%B0%EC%97%B4%EA%B3%BC-%EA%B0%99%EB%82%98%EC%9A%94</guid>
            <pubDate>Mon, 06 Jun 2022 12:05:16 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-비교">⬛ 비교</h3>
<table>
<thead>
<tr>
<th align="center">✅</th>
<th align="center">구분</th>
<th>자료구조의 배열</th>
<th>JS 배열</th>
</tr>
</thead>
<tbody><tr>
<td align="center"></td>
<td align="center">명칭</td>
<td>밀집 배열 <span style="color: var(--text3)">(Dense Array)</span></td>
<td>희소 배열<span style="color: var(--text3)">(Sparse Array)</span></td>
</tr>
<tr>
<td align="center"></td>
<td align="center">설명</td>
<td>동일한 크기의 메모리 공간이<br>연속적으로 늘어선 구조</td>
<td>각 메모리 공간의 크기가 다르며<br>불연속인 구조</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">의미</td>
<td>일반적인 의미의 배열</td>
<td>배열의 동작을 흉내낸 특수 객체</td>
</tr>
</tbody></table>
]]></description>
        </item>
        <item>
            <title><![CDATA[[배열] 🎯 forEach, map, reduce의 차이점은 뭔가요?]]></title>
            <link>https://velog.io/@m-dzn/%EB%B0%B0%EC%97%B4-forEach-map-reduce%EC%9D%98-%EC%B0%A8%EC%9D%B4%EC%A0%90%EC%9D%80-%EB%AD%94%EA%B0%80%EC%9A%94</link>
            <guid>https://velog.io/@m-dzn/%EB%B0%B0%EC%97%B4-forEach-map-reduce%EC%9D%98-%EC%B0%A8%EC%9D%B4%EC%A0%90%EC%9D%80-%EB%AD%94%EA%B0%80%EC%9A%94</guid>
            <pubDate>Mon, 06 Jun 2022 11:55:04 GMT</pubDate>
            <description><![CDATA[<p><a href="https://velog.io/@m-dzn/%EA%B8%B0%EC%88%A0-%EB%A9%B4%EC%A0%91-%ED%99%88">📋 기술 면접 홈 바로가기</a></p>
<br>

<h3 id="⬛-비교-표">⬛ 비교 표</h3>
<table>
<thead>
<tr>
<th align="center">✅</th>
<th align="center">구분</th>
<th>forEach</th>
<th>map</th>
<th>reduce</th>
</tr>
</thead>
<tbody><tr>
<td align="center"></td>
<td align="center">인수</td>
<td>현재 값<br>현재 인덱스<br>원본 배열</td>
<td>현재 값<br>현재 인덱스<br>원본 배열</td>
<td>누산기<br>현재 값<br>현재 인덱스<br>원본 배열</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">원본 변화</td>
<td>❌</td>
<td>❌</td>
<td>❌</td>
</tr>
<tr>
<td align="center">✅</td>
<td align="center">return 값</td>
<td>❌</td>
<td>새 배열</td>
<td>계산된 값</td>
</tr>
<tr>
<td align="center"></td>
<td align="center">사용 목적</td>
<td>for문<br>간단하게 쓰기</td>
<td>가공된<br>새 배열 생성</td>
<td>배열을 가공해<br>하나의 값 출력</td>
</tr>
</tbody></table>
]]></description>
        </item>
    </channel>
</rss>