IE에서 "개체가 속성 또는 메서드 '찾기'를 지원하지 않습니다."
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function () {
var data = [{
"Id": "SWE",
"Country": "Sweden",
"Population": 9592552
}, {
"Id": "NOR",
"Country": "Norway",
"Population": 5084190
}];
function display(e) {
alert("E" + e);
var countryData = data.find(function (element, index, array) {
return element.Id === e;
});
alert(countryData.Population);
}
display('SWE');
});
</script>
</head>
</html>
위에 게시 된 코드는 Firefox 및 Chrome에서 제대로 작동하지만 Internet Explorer에서 오류가 발생합니다. 에러 메시지:
Object doesn't support property or method 'find'
JavaScript array.find()방법을 사용하고 있습니다. 이것은 표준 JS이며 jQuery와 관련이 없습니다. 사실, 질문의 전체 코드는 jQuery를 전혀 사용하지 않습니다.
array.find()여기 에서 문서를 찾을 수 있습니다 : https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/find
이 페이지의 맨 아래로 스크롤하면 브라우저 지원 정보가 있고 IE가이 방법을 지원하지 않는다는 것을 알 수 있습니다.
아이러니하게도이 문제를 해결하는 가장 좋은 방법은 모든 브라우저에서 지원되는 유사한 기능을 가진 jQuery를 사용하는 것입니다.
언급했듯이 array.find()IE에서는 지원되지 않습니다.
그러나 여기에서 Polyfill에 대해 읽을 수 있습니다.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find#Polyfill
이 메서드는 ECMAScript 2015 사양에 추가되었으며 아직 모든 JavaScript 구현에서 사용하지 못할 수 있습니다. 그러나 다음 스 니펫으로 Array.prototype.find를 폴리 필 할 수 있습니다.
암호:
// https://tc39.github.io/ecma262/#sec-array.prototype.find
if (!Array.prototype.find) {
Object.defineProperty(Array.prototype, 'find', {
value: function(predicate) {
// 1. Let O be ? ToObject(this value).
if (this == null) {
throw new TypeError('"this" is null or not defined');
}
var o = Object(this);
// 2. Let len be ? ToLength(? Get(O, "length")).
var len = o.length >>> 0;
// 3. If IsCallable(predicate) is false, throw a TypeError exception.
if (typeof predicate !== 'function') {
throw new TypeError('predicate must be a function');
}
// 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
var thisArg = arguments[1];
// 5. Let k be 0.
var k = 0;
// 6. Repeat, while k < len
while (k < len) {
// a. Let Pk be ! ToString(k).
// b. Let kValue be ? Get(O, Pk).
// c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
// d. If testResult is true, return kValue.
var kValue = o[k];
if (predicate.call(thisArg, kValue, k, o)) {
return kValue;
}
// e. Increase k by 1.
k++;
}
// 7. Return undefined.
return undefined;
}
});
}
다음은 해결 방법입니다. 찾기 대신 필터를 사용할 수 있습니다. 하지만 필터는 일치하는 객체의 배열을 반환합니다. find배열 내에서 첫 번째 일치 만 반환합니다. 따라서 다음과 같이 필터를 사용하지 않는 이유는 무엇입니까?
data.filter(function (x) {
return x.Id === e
})[0];
Array.prototype.find IE의 모든 버전에서 지원되지 않습니다.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find
Just for the purpose of mentioning underscore's find method works in IE with no problem.
I solved same issue by adding polyfill following:
<script src="https://cdn.polyfill.io/v3/polyfill.min.js?features=default,Array.prototype.includes,Array.prototype.find"></script>
A polyfill is a piece of code (usually JavaScript on the Web) used to provide modern functionality on older browsers that do not natively support it.
Hope someone will help this
The Array.find method support for Microsoft's browsers started with Edge.
The W3Schools compatibility table states that the support started on version 12, while the Can I Use compatibility table says that the support was unknown between version 12 and 14, being officially supported starting at version 15.
참고URL : https://stackoverflow.com/questions/37788536/object-doesnt-support-property-or-method-find-in-ie
'IT TIP' 카테고리의 다른 글
| Jenkins 사용자 인증 세부 정보를 Jenkins API를 사용하여 작업을 생성하는 스크립트에 어떻게 "전달"할 수 있습니까? (0) | 2020.11.30 |
|---|---|
| AngularJS 드롭 다운 필수 유효성 검사 (0) | 2020.11.30 |
| WPF 애플리케이션에서 App.config 파일을 사용하는 방법은 무엇입니까? (0) | 2020.11.30 |
| Javascript에서 무한 루프를 어떻게 중지합니까? (0) | 2020.11.30 |
| CLS 규격 코드를 작성해야하는 이유는 무엇입니까? (0) | 2020.11.30 |