Front-end/JavaScript24 [javaScript] Optional chaining "?." 연산자 자바스크립트 / 리액트 코드등 앞단에서 의문의 연산자를 보았다. ex) edior?.canvas?.getObject() edior.canvas.getObject() - 이런 형식이 익숙하지만 코드 실행시 만약 canvas가 null 이라면 (null의 오브적트 임으로) 페이지가 오류가 나서 진행불가었다. 그래서 해결하는 방법이 ? 를 붙여 주는것 에러가 발생하지지 않고 undefined 를 리턴해주어 오류를 발생시키지 않는다. 😎 Optional chaining optional chaining 연산자 (?.) 는 체인의 각 참조가 유효한지 명시적으로 검증하지 않고, 연결된 객체 체인 내에 깊숙이 위치한 속성 값을 읽을 수 있다. ?. 연산자는 . 체이닝 연산자와 유사하게 작동하지만, 만약 참조가 null.. 2021. 12. 30. [javaScript] URL정보 (window.location) 테스트 환경에서 localhost라고 host명을 고정해서 테스트하는 경우가 있습니다. 운영환경의 호스트명은 다르므로 운영환경에 맞게 호스트명을 자동으로 변경하고 싶은 경우가 있습니다. (물론 html파일이니까 리플레이스를 통해서 치환하면됩니다.) 여기서 사용할 수 있는 순수 자바스크립트는 다음과 같은 것이 있습니다. 예) http://192.168.0.94:85/hoops_web_viewer_sample.html?viewer=csr&instance=moto 예와 같이 URL이 있다고 할 때, 구글 크롬의 개발자 도구의 콘솔에 window.location을 조회해 보면 다음과 같은 내용을 확인할 수 있습니다. 참고로 window는 최상위 엘리먼트이므로 location으로 조회를 해도 같은 결과가 나옵니다.. 2021. 12. 27. [JavaScript] reload() 메서드 - 페이지 새로고침 😎캐시에서 페이지 가져와 새로고침 (= false 옵션) [예제1] HTML과 스크립트 분리 새로고침 [예제2] HTML과 스크립트 일체 캐시새로고침 ※ location.reload() 메서드 기본값이라, false는 생략 가능. 😎서버에서 페이지 가져와 새로고침. (= true 옵션) 새로고침 서버새로고침 😎reload() 정의 - 페이지 새로고침 (= 리로드) - 모든 주요 브라우저 지원 😎reload() 구문 location.reload(forceGet) [매개변수] forceGet 선택. 새로고침 방법 지정. (= 리로드 타입 지정) false : 캐시에서 가져와 현재페이지 새로고침. (기본값.) true : 서버에서 가져와 현재페이지 새로고침. 2021. 11. 16. 새창을 여는 window.open() 함수 사용법 웹브라우저에서 새창을 열기 위해서 가장 간단히 사용할 수 있는 방법이 자바스크립트 window 객체의 open() 함수를 사용하는 것입니다. 1. 문법(Syntax) var ret = window.open(url, name, specs, replace); 1.1. 반환값(ret) 새로 만들어진 창 객체가 반환됩니다. 창의 생성에 실패하면 null을 반환합니다. 이 객체를 통해서 새창을 제어할 수 있습니다. 예로 ret.close(); 로 창을 닫을 수 있습니다. 1.2. url 새창에 보여질 주소 입니다. 선택적인 값으로 비워두면 빈창(about:blank)이 보입니다. 1.3. name 새로 열릴 참의 속성 또는 창의 이름을 지정합니다. 선택적인 값으로 기본값은 "_blank" 입니다. 사용 가능한 값.. 2021. 11. 9. [JAVASCRIPT] 이미지 클릭시 새창띄우기 (base64 이미지) JS 코드 : window.open 사용 : 이미지가 경로가 아닌 Base64 인코딩된 값 : width, height 이미지사이즈에 맞게 지정가능하다. 나의 경우 base64 인코딩 값이 이미지 src 여서 600px 로 지정해줌 const clickImg = (imgsrc,pageName) =>{ // alert(imgsrc); var imageWin = new Image(); imageWin = window.open("", "", "width=600px, height=600px"); imageWin.document.write(""); imageWin.document.write(""); imageWin.document.write(""); imageWin.document.title = pageName;.. 2021. 11. 9. [JavaScript] 천단위 콤마 찍기, 소수점 포함 javascript 정규식을 사용하여 input text box에 입력받는 숫자들을 천단위로 콤마를 찍어보자. 물론 소수점도 입력된다. JavaScript //문자 제거 function removeChar(event) { event = event || window.event; var keyID = (event.which) ? event.which : event.keyCode; if (keyID == 8 || keyID == 46 || keyID == 37 || keyID == 39) return; else //숫자와 소수점만 입력가능 event.target.value = event.target.value.replace(/[^-\.0-9]/g, ""); } //콤마 찍기 function comma(obj).. 2021. 4. 20. 이전 1 2 3 다음 728x90 반응형
