개발

해당 포스팅은 자바스크립트에서 undefined와 null의 공통점과 차이점. 해당 값을 체크하는 방법에 대해 다룹니다. Null null은 JavaScript의 원시 값중 하나로, 어떤 값이 의도적으로 비어있음을 표현하며 불리언 연산에서는 거짓으로 취급합니다. -MDN- console.log(!null); // true console.log(!!null); // false console.log(null === false); // false console.log(!null === true); //true // null => math =>0 console.log(null + 123) //123 console.log(typeof null); // object' null 자체는 불리언 값을 가지지 않지만 !n..

해당 포스팅에서는 innerHTML, innerText, textContent에 대한 특성을 알아보고 innerText와 textContent의 차이점에 대해 다룹니다. 프로퍼티 textContent innerText innerHTML 값 raw text rendered text HTML parsed text 성능 좋음 보통 나쁨 보안 취약 Element.innerHTML const content = element.innerHTML; element.innerHTML = htmlString; 이름 그대로 HTML을 반환한다. 간혹 innerHTML을 사용해 요소의 텍스트를 가져오거나 쓰는 경우가 있지만, HTML로 분석할 필요가 없다는 점에서 textContent의 성능이 더 좋다. XSS 공격 (en-U..

해당 포스팅에서는 i18n의 의미와 바닐라 자바스크립트를 사용하여 국제화 하는 방법에 대해서 다룹니다. i18n이란? internationalization(국제화)의 축약형으로 웹사이트에서 다국어를 지원하는 것을 의미합니다. I18n은 영어 첫글자 "I" + 18글자 + "N"을 의미합니다. 비슷한 축약형으로 L10N(localization)이 있습니다. 라이브러리 명칭을 뜻하는 것이 아니라 국제화 행위 그 자체이다. 이에 관련된 유명한 라이브러리로 i18next가 이다. 기본적인 i18n 방법 // 번역 데이터 const en_US= { "이름" : "name" } const getEngText = function(string) { return en_us[string] } console.log(getE..

들어가며 이 글은 텍스트 복사 붙여넣기 기능 구현을 위해 execCommand(), execCommand()를 사용하지 말아야하는 이유, Clipboard API사용법에 대해 다룹니다. 💡 결론 document.execCommand()는 브라우저마다 일관적이지 않은 엘리먼트를 생성해서 사용을 지양해야한다. 대신 Clipboard API의 readText()와 writeText() 메서드를 사용한다. Clipboard API는 브라우저에서 완벽하게 지원하지 않으니 확인하고 사용하기 👎 기능 구현 방법1 document.execCommand() 문서의 편집 가능한 영역을 변경할 수 있습니다. 대부분의 명령어는 문서의 선택 영역에 영향(볼드, 이탤릭 등)을 미치고 나머지는 새 요소를 추가(링크 추가)하거나 전..