0

これが私のコードです

function dl(name){
 this.name=name;
 this.getInfo();
};
dl.prototype={
 getInfo:function(){
  this.x=new XMLHttpRequest;
  this.x.open('GET',this.name);
  this.bind=this.setInfo.bind(this);
  this.x.addEventListener('load',this.bind,false);
  this.x.send();
 },
 setInfo:function(){
  this.info=this.x.response;
  this.x.removeEventListener('load',this.bind,false);
  delete this.bind;
  delete this.x;
  this.insertDOM();
 }
};

function dl(){}ですべてにアクセスしたいので、アプローチを使用しthisます。

prototypeたくさん作成するとメモリに影響しないので使用new dl(SOMEURL)します。

しかし、内部には多くの xhr2 関数があるため、すべてを正しく返すための最良の方法を見つける必要があります。

したがって、xhr2を通常どおり使用するのは素晴らしいことです...

function ajax(a,b,c){ //url,function,placeholder
 c=new XMLHttpRequest;c.open('GET',a);c.onload=b;c.send();
}    
//example onload function    
function b(){ //don't even need event....
 console.log(this.response)
}

良い: 私は関数参照のみを渡します (引数なし、奇妙なことではありません、私 vars..)

悪い: クラスでthis、自分のクラスへのポインターを失います

だから私は自分のクラス内で xhr オブジェクトを定義することから始めました

this.x=new XMLHttpRequest;

bindこれを次の関数 this.setInfo に渡していました

しかし、後でイベントリスナーを削除するには、バインドされた関数を含む新しい変数を定義する必要があります。

this.bind=this.setInfo.bind(this);

そして、私はそれが本当に嫌いです.（私はできるだけ多くの変数を使用しようとしており、メモリを使用していません）

これが本当にイベントを削除するかどうかさえわかりません。

私が考えている他の解決策は、これを xhr2 オブジェクトに参照することです。

function dl(name){
 this.name=name;
 this.getInfo(this.name);
};
dl.prototype={
 getInfo:function(){
  var x=new XMLHttpRequest;
  x.that=this;
  x.open('GET',this.name);
  x.addEventListener('load',this.setInfo,false);
  x.send();
 },
 setInfo:function(){
  this.that.info=this.response;
  this.removeEventListener('load',this.setInfo,false);
  this.that.insertDOM();
  delete this.that;
 }
};

A.参照のみ ですかthis.that、それともメモリをいっぱいにしますか?

私は、この関数のそれぞれの後に、ガベージコレクターを助けるためにもう必要のないすべての変数を削除/クリアすることを確認する必要があります。

B. このタイプの JavaScript クラスを作成する上で、より良い解決策はありますか??

ps .:dl 内の最初の関数を初期化するよりエレガントな方法はありますか?

このクラスは何のためですか??

Chrome のダウンロード マネージャーです。

使い方？？

ダウンロードリンクをinputフィールドに入れました

new dl(SOMEURL)クラスは aを配列に追加します

php cUrl スクリプトでファイル情報を取得します。

クラス内にファイル情報を保存します

サイズに基づいてファイルの最初のチャンクを取得して、別の xhr を実行します。

チャンクは、window.webkitrequestfilesystem以前に作成されたファイルに追加されます。

その後、すべてのチャンクがダウンロードされてファイルシステムに追加されるまで、xhr リクエストをループし続けます。

ファイル オフセット ステータスを に保存すると、window.LocalStorage後でダウンロードを再開する機会が得られます。

4

2 に答える 2

1

スクリプトは動作するようになりましたが、いくつか変更を加えました。まず、put x.that を onreadystatechange イベント内で使用できるローカル変数 (インスタンス) に置き換えました。次に、onreadystatechange イベントを追加し、ajax リクエストがロードされたときに関数を実行できるようにしました。また、イベント リスナーが機能するように変更しましたが、onreadystatechange を使用することをお勧めします。3 番目に、テストするものをいくつか追加しました。コードは Chrome で動作します。最後に、setInfo を変更して、ajax リクエストの応答をパラメーターとして受け取るようにしました。それが私がしたすべてだと思うので、コードは次のとおりです。

function dl(name){
    this.name = name;
    this.getInfo(this.name);
};
dl.prototype = {
    getInfo:function(){
        var instance = this;
        var x = new XMLHttpRequest();
        x.open('GET', this.name, false);

        // onreadystatechange event
        x.onreadystatechange = function(){
            if(x.readyState == 4){
                if(x.status == 200){
                    instance.setInfo(x.responseText);
                } else {
                    /*
                        there was a network failure 
                        (File Not Found, Internal Server Error ...)
                    */
                }
            }
        }

        // if you really want to use event the listeners you had previously:
        this.request = x;
        x.addEventListener('load', function(){
            instance.setInfo(x.responseText);
        } ,false);

        x.send();
    },
    setInfo:function(response){
        this.info = response;

        // if you used the event listeners
        this.request.removeEventListener('load', function(){
            instance.setInfo(x.responseText);
        } ,false);
        delete this.request;

        // this.insertDOM();
        // I just added this for testing purposes only
        document.body.innerHTML = this.info;
    }
};

// added for testing
window.addEventListener("DOMContentLoaded", function(){
    var dlTest = new dl("filetoget")
}, false);

お役に立てれば。

于 2013-08-06T23:10:07.710 に答える
1

新しいコードは次のとおりです。

function dl(name, callback) {
    this.name = name;
    this.callback = callback;
    this.getInfo();
}
dl.prototype = {

 getInfo:function(){
  var x=new XMLHttpRequest;
  x.that=this;
  x.open('GET',this.name,false);
  x.addEventListener('load',this.setInfo,false);
  x.send();
 },
 setInfo:function(){
  this.that.info=this.response;
  this.removeEventListener('load',this.setInfo,false);
  //this.that.insertDOM();  
  // when you need to refer back
     this.that.callback(this.responseText);

  delete this.that;
 }   
}

function call() {
    var a = 1;
    var b = 2;

    new dl("filetoget", function (response) {
        console.log(a + b);
        console.log(response);
    });
}

call();
于 2013-08-06T23:58:51.757 に答える