간단한 JavaScript 뮤텍스 잠금 공유_javascript 기술

작년에 JavaScript 뮤텍스 잠금을 사용해야 하는 프로젝트가 여러 개 있어서 비슷한 프로젝트를 여러 개 작성했습니다.

코드 복사 코드는 다음과 같습니다.

//Published by Indream Luo
//Contact: indreamluo@qq.com
//Version: Chinese 1.0.0

!function ($) {
    window.indream = window.indream || {};
    $.indream = indream;

indream.async = {
                                                                                      > lock] && action) {
$.indream .async.lockStatus[lock] = true;
if (arguments.length > 2) {
var args = 'arguments[2]';
for (var i = 3; i < 인수 .length; i ) {
                   args = ', 인수[' i ']';
                               args ')'); > > /잠금: 잠금 번호
                                                                                                                   그런 다음 대기 대기열을 실행하고 그렇지 않으면
잠금을 해제합니다. if ($ .indream.async.waitings [lock] .Length) {
$ .indream.async.waitings [lock] [0 ] ();
} else {
                                                                                                                          🎜> 잠금 상태: [ ],
          //
                                    ~                                                                                  (잠금, 동작) {
$.indream.async.waitings [코드] = $. indream.async.waitings[코드] || [];
$.indream.async.waitings[코드].push (액션);
},
          //
                                                             : {
                                                                                //듣기
//
듣기: 함수(actionName , 콜백) {
var list = $.indream.async. 액션.콜백. list;
list[actionName] = list[actionName] || [];
.push(callback );
},
                                                 args) {
var list = $.indream.async .action.callback .list;
if (list[actionName] && list[actionName].length) {
for (var i in list[actionName]) {
indream.async.action.call( 목록[ actionName][i], args);
                                                                                //기존 통화 뒤로 목록
//
목록: []
          },
                                                                                                   { 🎜> var args = 'arguments[1]';
for (var i = 2; i < 인수.길이; i ) {
               args = ', 인수[' i ']';
                                                   action(); 🎜> }
}(window.jQuery);



뮤텍스의 요소는 다음과 같습니다.

•잠금 및 잠금 해제
•대기 대기열
•실행 방법
위 잠금 사용법:





코드 복사

코드는 다음과 같습니다.

//자물쇠 이름 정의
var lock = 'scrollTop()';
//잠금 사용

$.indream.async.lock(lock, function () {

var scrollTop = $(window).scrollTop();

var 타이머 ; var fullTime = 100; for (timer = 0; 타이머 <= fullTime; 타이머 = 10) { setTimeout('$(window).scrollTop(' (scrollTop) * (fullTime - 타이머 ) / fullTime) ');', 타이머); } //잠금 해제 setTimeout('$.indream.async.releaseLock("' 잠금 '");' , 풀타임);

});

이 구현의 구현에 대한 간략한 설명입니다.

-스핀 잠금 또는 세마포
JavaScript 자체에는 잠금 기능이 없으므로 모든 잠금은 높은 수준에서 구현됩니다.

JavaScript의 단일 스레드 원칙에 따르면 JS의 스레드 리소스는 매우 제한되어 있고 스핀 잠금을 사용하기에는 매우 부적합하므로 세마포어를 사용하기로 결정했습니다.

스핀 잠금의 구현은 대략 다음과 같습니다. 물론 do while이 더 유용합니다.

코드 복사

코드는 다음과 같습니다.

while(true) {

/ /뭔가를 해라...

}

이렇게 하면 필연적으로 스레드 리소스를 차지하게 됩니다. 불행하게도 JS에서는 실행할 스레드가 하나뿐이므로 매우 부적합합니다. 물론, 필요하다면 setInterval과clearInterval의 조합을 선택하여 좋은 결과를 얻을 수도 있습니다.

여기서는 세마포어 방식을 사용하는데, 코드만큼 원리는 간단합니다. 작업 실행 순서는 대략 다음과 같습니다.

• 코드 세그먼트(콜백 액션)를 대기 대기열에 넣습니다.
• 현재 잠금이 유지되어 있는지 확인하고, 잠금이 유지되어 있으면 해제를 기다리고, 그렇지 않으면 잠금을 획득하고 콜백을 실행합니다.
• 잠금이 유지되면 해제하고 대기 대기열에서 다음 콜백을 이동하고 여기에 잠금을 전달한 후

을 실행합니다.

-자동 해제 또는 수동 해제
가장 편한 방법은 물론 잠근 후 현재 프로그램이 실행될 때 자동으로 해제하는 것이지만, 맞춤형 해제 시나리오가 필요한 상황이 많아지기 때문에 쉽지 않습니다. .

잠금을 사용하는 방법은 비동기식이므로 AJAX, jQuery 애니메이션 등 다양한 비동기 콘텐츠가 주로 등장합니다. 이때 자동 릴리스는 요구 사항을 충족하지 않습니다. 실제로 실제 "실행이 완료"되는 것은 내부 비동기 콜백이 완료된 후, 즉 기본적으로 개발자만이 제어할 수 있기 때문입니다. 따라서 여기서는 수동 릴리스를 선택합니다.

그러나 여전히 반복출시라는 단점이 있습니다.

액세스 수준에서 로컬 변수가 격리되지 않는 한 모든 잠금 개체가 공개되거나 모든 JS 개체가 공개라고 해야 합니다. 그러나 여기서 "잠금" 자체는 공개 리소스이므로 처리할 수 있는 방법이 없습니다.

여기서 수행할 수 있는 최적화는 setInterval 및clearInterval과 같아 공개 잠금 이름으로 잠그고 비공개 잠금 ID로 잠금 해제하여 반복 해제를 방지해야 합니다. 하지만 위의 기존 코드에는 없으며, 곧 사용될 것으로 예상됩니다.