반응형
12-24 07:02
Today
Total
«   2024/12   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
관리 메뉴

개발하는 고라니

Javascript Arrow Function at IE 본문

오늘의 삽질

Javascript Arrow Function at IE

조용한고라니 2021. 4. 4. 16:34
반응형

자바스크립트는 함수를 표현할 때 아래와 같이 표현하는 방법이 있다.

var f1 = function (a) {

}

var f1 = (a) => {

}

ES6 (ECMAScript standard 6)에서 함수 작성을 위한 새로운 구문을 도입했다. 바로 Arrow Function이다. 화살표 함수에 대한 자세한 내용은 여기서는 다루지 않고 하단 링크를 통해 추후 자세히 공부해보도록 한다.

 

화살표 함수 - JavaScript | MDN

화살표 함수 화살표 함수 표현(arrow function expression)은 function 표현에 비해 구문이 짧고  자신의 this, arguments, super 또는 new.target을 바인딩 하지 않습니다. 화살표 함수는 항상 익명입니다. 이  함

developer.mozilla.org

 

ES6 In Depth: Arrow functions – Mozilla Hacks - the Web developer blog

ES6 In Depth is a series on new features being added to the JavaScript programming language in the 6th Edition of the ECMAScript standard, ES6 for short. Arrows have been ...

hacks.mozilla.org

웹소켓을 이용해 채팅을 구현하던 도중, IE 10부터는 WebSocket을 지원한다고 했지만, 그 하위버전은 WebSocket을 지원하지 않는다고 한다. 따라서 SockJS를 이용해 WebSocket Emulation을 하려고 했다.

 

그래서 여러 예제를 참조하며 코드를 작성해보았으나 왜인걸 WebSocket이던 Streaming, Polling 아무것도 되지 않는 것이다. 그렇게 삽질을 하던 도중 콘솔에 적힌 오류를 보았는데..

 

IE 11에서도 =>를 이용한 화살표 함수가 먹히지 않는 것이다. 단지 이것때문에 되지 않던 거였다.

이것을 그냥 function()으로 고치니 바로 적용되는 것을 확인할 수 있었다.

 

실제로 MDN에서 확인한 결과 브라우저 호환성은 다음과 같다. IE는 버전과 상관없이 지원하지 않는다.

정말 웹 개발에 있어 브라우저 간 호환성은 고질적인 문제인 것 같다.

 

(+추가)

IE 10부터는 WebSocket을 지원하기 때문에 IE 8, 9는 다른 기술로 (예를 들어 xhr/streaming 등) 잘 동작할 줄 알았는데 작동이 되지 않는 것을 확인했다.

원인은 바로 const와 let 키워드였다. 이것을 var로 변경하니 바로 잘 동작하였다.

 

망할 IE

반응형

'오늘의 삽질' 카테고리의 다른 글

Uncaught TypeError: $.ajax is not a function  (0) 2021.01.03
Comments