>웹 프론트엔드 >JS 튜토리얼 >메모리 누수란 무엇이며 해결 방법

메모리 누수란 무엇이며 해결 방법

清浅
清浅원래의
2019-03-16 11:49:434032검색

메모리 누수는 객체가 비효율적이어서 재활용해야 하지만 다른 객체의 참조로 인해 재활용할 수 없고 힙 메모리에 남아 있는 경우를 메모리 누수라고 합니다. 일반적인 것으로는 예상치 못한 전역 변수, DOM 누수 및 순환 참조 등이 있습니다.

메모리 누수란 무엇이며 해결 방법

[추천 과정: JavaScript Tutorial]

Memory Leaks

메모리 누수는 일반적으로 다음을 의미합니다. a 객체가 기능이 없어서 재활용해야 할 경우, 사용 중인 다른 객체는 해당 객체를 참조하므로 재활용할 수 없습니다. 이 재활용할 수 없는 객체는 힙 메모리에 남아 메모리 누수가 발생합니다.

더 이상 필요하지 않고 재활용되어야 하는 경우, 사용 중인 다른 객체가 이에 대한 참조를 보유하므로 재활용되지 않습니다. 이로 인해 재활용되어야 하는 객체가 힙 메모리에 남아 있게 됩니다.

일반적인 메모리 누수는 다음과 같습니다.

1. 예상치 못한 전역 변수

Js가 정의되지 않은 변수를 처리하는 방식: 정의되지 않은 변수는 전역 개체에 새 변수를 생성하며, 브라우저에서는 전역 개체가 window입니다.

function foo(arg) { 
bar = "this is a hidden global variable"; //等同于window.bar="this is a hidden global variable"
this.bar2= "potential accidental global";//这里的this 指向了全局对象(window),
等同于window.bar2="potential accidental global"}

해결책: 위의 문제를 효과적으로 방지하려면 JavaScript 프로그램에서 엄격 모드 '엄격 사용'을 추가하고 활성화하세요.

참고: 대량의 데이터를 임시 저장하는 데 사용되는 전역 변수는 null로 설정하거나 데이터가 처리되었는지 확인한 후 다시 할당해야 합니다.

2. DOM 누출

브라우저에서는 DOM과 JS가 사용하는 엔진이 다릅니다. DOM은 렌더링 엔진을 사용하고 JS는 v8 엔진을 사용하므로 JS를 사용하여 DOM을 작동할 때 비교가 됩니다. 성능이 소모되므로 DOM 작업을 줄이기 위해 변수 참조를 사용하여 현재 환경에서 캐시합니다. 일부 삭제 및 업데이트 작업을 수행하면 캐시된 DOM을 해제하는 것을 잊어버려 메모리 누수가 발생할 수 있습니다.

예: uncleaned DOM 요소

var refA = document.getElementById('refA');
document.body.removeChild(refA); // #refA不能回收,因为存在变量refA对它的引用。
将其对#refA引用释放,但还是无法回收#refA。

에 대한 참조 해결 방법: Set refA = null;

3. 잊음 타이머 및 콜백 함수

var someResource = getData();
setInterval(function() {
    var node = document.getElementById('Node');
    if(node) {
        node.innerHTML = JSON.stringify(someResource));
    }
}, 1000);

이와 같은 코드는 매우 일반적입니다. ID가 Node인 요소가 DOM에서 제거되면 콜백 함수에 someResource에 대한 참조가 포함되어 있기 때문에 타이머는 여전히 존재합니다. 타이머 외부의 someResource는 해제되지 않습니다

4. 순환 참조

js의 메모리 관리 환경에서 객체 A가 객체 B에 액세스할 수 있는 권한이 있으면 객체 B를 참조하는 객체 A라고 합니다. 참조 계산 전략은 객체를 참조하는 다른 객체가 있는지 확인하는 것입니다. 객체를 참조하는 객체가 없으면 객체가 재활용됩니다.

var obj1 = { a: 1 }; // 一个对象(称之为 A)被创建,赋值给 obj1,A 的引用个数为 1  
var obj2 = obj1; // A 的引用个数变为 2  
 obj1 = 0; // A 的引用个数变为 1 
 obj2 = 0; // A 的引用个数变为 0,此时对象 A 就可以被垃圾回收了

하지만 참조 카운팅의 가장 큰 문제는 순환 참조입니다.

function func() {  
    var obj1 = {};  
    var obj2 = {};  
    obj1.a = obj2; // obj1 引用 obj2  
    obj2.a = obj1; // obj2 引用 obj1  }

함수 실행 시 반환 값이 정의되지 않아 전체 함수와 내부 변수를 재활용해야 하지만, 참조 카운팅 방식에 따르면 obj1과 obj2의 참조 개수는 0이 아니므로, 재활용되지 않습니다. 따라서 이 문제를 해결하려면 해당 값을 null로 설정하면 됩니다

요약: 위 내용은 이 기사의 전체 내용이므로 모든 사람에게 도움이 되기를 바랍니다.

위 내용은 메모리 누수란 무엇이며 해결 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.