블로그 글을 작성하면서 구글 블로거의 코드 블록 사용에 어려움을 느꼈습니다. HTML 모드로 전환하여 <pre><code></code></pre> 태그를 사용하는 방식은 번거롭고 혼란스러웠습니다. 이를 개선하고자 마크다운 스타일의 백틱(```)을 사용하여 코드 블록을 쉽게 만들 수 있는 방법을 고안했습니다. 배경 기술 이 포스팅은 구글 블로거에서 마크다운 스타일의 코드 블록과 highlight.js를 활용하여 사용자 경험을 향상시키는 데 중점을 두었습니다. 마크다운은 간편한 문서 작성을 가능하게 하는 도구이며, highlight.js는 코드에 색상을 추가해 가독성을 높이는 라이브러리입니다. 이러한 기술을 결합함으로써, 블로거들은 코드를 쉽게 삽입하고 스타일링할 수 있으며, 독자들은 깔끔하고 전문적인 블로그 포스트를 경험할 수 있습니다. 구현 방법 1. 백틱 변환 함수 개선: 백틱(```)으로 시작하고 끝나는 부분을 <pre><code></code></pre> 로 변환하는 기능을 구현했습니다. 정규 표현식을 활용해 백틱으로 둘러싸인 부분을 찾고 변환합니다. function convertBackticksToHTML(text) { return text.replace(/```(.*?)```/gs, " $1 "); } 2. 언어 특정 클래스 추가: 마크다운에서 특정 언어를 지정하는 것처럼, 예를 들어 ```sql 처럼 입력하면 SQL 형식으로 표시되도록 개선했습니다. 이를 위해 정규 표현식을 조정하여 언어에 맞는 클래스를 추가했습니다. function convertBackticksToHTML(text) { return text.replace(/```(\w+)?\s([\s\S]*?)```/g, function(match, lang, code) { lang = lang || ''; // 언어가...
안녕하세요! 오늘은 JavaScript에서 변수가 null 이나 undefined 인지 간단하게 확인할 수 있는 유용한 Logical operator, 더블 NOT(!!) 연산자에 대해 알아보겠습니다. Double NOT (!!): JavaScript의 더블 NOT 연산자는 매우 간단하지만 강력한 툴입니다. 일반적인 NOT(!) 연산자는 Boolean 값을 부정합니다. 예를 들어, ` !true` 는 ` false` 를, ` !false` 는 ` true` 를 반환합니다. ``` !true; // !t returns false !false; // !f returns true !""; // !f returns true !"Cat"; // !t returns false !null; // !f returns true ``` 하지만 ` !!` 연산자를 사용하면, 한번 부정된 Boolean 값을 다시 부정하여 원래의 truthy/falsy 여부를 얻을 수 있습니다. ``` !!true; // !t returns true !!false; // !f returns false !!""; // !f returns false !!"Cat"; // !t returns true !!null; // !f returns false ``` null과 undefined 확인하기: JavaScript에서 `null`과 `undefined`는 둘 다 falsy한 값입니다. `null`은 명시적으로 값이 없음을 나타내는 반면, `undefined`는 값이 할당되지 않은 상태를 의미합니다. 더블 NOT 연산자를 사용하면 이러한 상태를 쉽게 확인할 수 있습니다. ``` var value1 = null; var value2 = undefined; var isValue1Null = !!value1; // !f returns false var isValue2Undefined = !!value2; // !f r...