Angular의 구조JS는 변수가 언제 변하는지 알고 있습니까?Angular의 구조JS 더티 체크 작업?

Angular의 구조JS는 변수가 언제 변하는지 알고 있습니까?Angular의 구조JS 더티 체크 작업?

앵글이 어떻게 된 건지 좀 더 알기 위해 기사를 읽었어요JS는 동작합니다.

제가 이해하지 못한 용어 중 하나는Dirty Checking.

그것은 정확히 무엇이니?옵저버 패턴 같은데 더 나은 것 같아요.

제가 이것을 이해하도록 도와주실 수 있나요?

편집: 이 비디오를 몇 년 전 NgEurope에서 스위핑에서 보는 것도 도움이 될 수 있습니다.

이 링크에서:

각도는 이른바 다이제스트 사이클의 개념을 정의합니다.이 사이클은 루프로 간주할 수 있습니다.이 기간 동안 Angular는 모든 $scope에 의해 감시되는 모든 변수에 변경이 있는지 확인합니다.따라서 컨트롤러에 $scope.myVar가 정의되어 있고 이 변수가 감시 대상으로 마크되어 있는 경우에는 루프의 반복마다 myVar의 변경을 감시하도록 Angular에게 명시적으로 지시합니다.

이 "digest「」는, 스코프의 변경을 스캔 하기 때문에, 「스캔 체크」라고도 불립니다.관찰할 수 있는 패턴보다 나은지 나쁜지 말할 수 없다.니즈에 따라 다르죠.

일부 링크:

• 각도 문서
• Angular Scopes에 대한 블로그 게시물

Angular Dirty Checking 메커니즘 워크플로우.

더티 체크는 매우 기본적인 개념으로 요약되는 간단한 프로세스입니다.앱 전체에서 아직 동기화되지 않은 값이 변경되었는지 확인합니다.

Angular 앱은 현재 시계의 값을 추적합니다.Angular는 $watch 목록을 내려갑니다.업데이트된 값이 이전 값과 변경되지 않은 경우 목록 아래로 계속됩니다.값이 변경된 경우 앱은 새 값을 기록하고 $watch 목록을 계속합니다.

여기서 전체 기사를 확인하세요.

더티 체크가 뭐죠?

변화를 감지하기 위해 모든 시계를 확인하는 과정을 더티 체크라고 합니다.두 가지 시나리오가 있을 수 있습니다.

첫 번째 –

1. 목록에서 시계 가져오기
2. 품목변경여부확인
3. 아이템에 변경이 없는 경우
4. 작업이 수행되지 않았습니다. 워치 목록의 다음 항목으로 이동합니다.

두 번째 -

1. 목록에서 시계 가져오기
2. 품목변경여부확인
3. 항목에 변경이 있는 경우
4. DOM을 업데이트해야 합니다. 다이제스트 루프로 돌아갑니다.

두 번째 경우 루프는 루프 전체에 변화가 없을 때까지 계속됩니다.또한 완료되면 필요에 따라 DOM이 업데이트됩니다.

이전 답변을 수정하는 중...

각도에는 '소화 주기'라는 개념이 있습니다.루프로 간주할 수 있습니다.Angular는 모든 변수가 감시하는 모든 변수에 변화가 있는지 확인합니다.$scopes(내부 및 함수는 에 정의된 각 변수와 결합됩니다).

만약에 ★★★★★★★★★★★★★★★★★★★★★★★.$scope.myVar되어 있습니다(즉, 이 「」를 합니다).myVar되어 있습니다). Angular에게 명시적으로 합니다.그러면 Angular에게 변경 내용을 감시하도록 명시적으로 지시합니다.myVar루프의 각 반복에서. 래 of의 myVar, 변경$watch()하여 실행하다$apply()DOM dom 、 DOM dom dom dom 。

이 "Digest"는 "Dirty Check(더티 검사)"라고도 불리는데, 어떤 면에서는 스코프에서 변경을 스캔하기 때문입니다.모든 watched 변수가 단일 루프(다이제스트 사이클)에 있기 때문에 변수의 값을 변경하면 DOM 내의 다른 watched 변수의 값이 재할당됩니다.

장점: 이것이 Angular가 양방향 데이터 바인딩을 실현하는 방법입니다.

단점: 한 페이지에 감시 변수가 더 많을 경우(2000~3000 이상), 페이지 로드 중에 지연이 발생할 수 있습니다.(단, 한 페이지에 감시 변수가 많으면 잘못된 페이지 설계입니다:p).

다른 단점도 있고 회피책도 있습니다.d

Dirty Check는 $scope 변수의 모든 변경을 체크하고 DOM으로 업데이트합니다.angular js에 의해 수행되며, 직접 더티 체크를 구현할 수도 있습니다.

나는 이 블로그 포스트에서 더러운 체크에 대한 훌륭한 기사를 읽었다.SO의 답변도 있었습니다.

TLDR; 버전

$digest 사이클이 시작되면 감시자는 스코프 모델에 변경이 있는지 확인하고 변경이 있는 경우(변경사항이 Angular-domain 외에서도 발생할 수 있음) 대응하는 수신기 기능이 실행됩니다.그러면 $digest 루프가 다시 실행되고 스코프 모델이 변경되었는지 확인합니다(청취자 함수도 스코프 모델을 수정할 수 있습니다).

전체적으로 $digest 사이클은 리스너가 모델을 변경하지 않거나 최대 루프 카운트 10에 도달할 때까지 2회 실행됩니다.

언급URL : https://stackoverflow.com/questions/24698620/how-does-angularjs-know-when-variables-change-how-does-angularjs-dirty-checking