「クリーン」JavaScript：続き

時々、人類は、そのくすみと状況を実際に見ようとすることを好まないことに驚かされます...（不明）

おそらく、このエピグラフは私が思っている以上に私と関係がありますが、私は最高のものを願っています...

私の最初の投稿は、それほどではありませんでしたが、軽度に言えば、すべての人がすべてを修正する機会を持つべきでした。

仕事中に私に起こった小さな話をします。 ずいぶん前のことですが、どういうわけか私は新しいWebプロジェクトに参加しました。 Timlidは最初にsvn phpおよびjsフレームワークをアップロードしました。
Mootools 1.2.2または1.2.4がJSとして選択され、それに加えてJxLib形式のJx UIライブラリが選択されました 。 すべてが順調に進み、プロジェクトはほぼ完成し、ブラウザのバージョンは成長し続けていました。 それで、ある時点で、私が仕事に来たときに、バグを見つけました。IE9（そして彼が去ったばかり）では、管理パネルがまったく機能しないとコアで言われました。 最初に問題を探し始めたのは、Mootools 1.2.xであることが判明したためです-IE9をサポートしていませんが、1.3.xを超えるバージョンでは、すべてが機能します。 さて、ためらうことなく、この奇跡の最新バージョンをダウンロードして、それを入れてください。 私は長い間喜ぶ必要はありませんでした-彼らはJxLibでバグを取得し始めました。 プロジェクトは「停止」しており、利用可能な最新バージョンはMootools 1.2.xとのみ互換性があります。 その瞬間から多くの時間が経過しましたが、このバグにパッチを適用しなければならなかったたわごとのコードは、Mootoolsとそのようなものに対する私の信念を破りました。 今、私は、JSライブラリに対するこの態度がどこから来たのかが明らかになったと思います。

そして今、私はいくつかのコメントに答えたい（そうではなく、そうでないことを説明する）。

1）
Console.log-これを期待していませんでしたが、たくさん提供しましたが、そうではありませんでした。 私はそれ（console.log）がいくつかのパラメータのフォーマットと受け渡しをサポートしていることを知っていますが、最後にそれをいつ使用したか覚えていません。 1つの変数で十分であり、月に一度console.logの全機能を使用するために_d（）を複雑にすることは非現実的です（ `console.log`の切望された11文字を書く方が簡単です）。

2）

addEvent関数は、_d関数を使用してエラーを処理した後、引き続き実行されます。

-私はこれを知っています、これは意図的に行われます、なぜならDOMオブジェクトの存在を確認するからです

3）

変数のグローバル空間の汚染は非常に悪いトーンです。

-ここでは正しいですが、 readyList = []を除きます。 グローバルなものは見つかりません:)

さて、これらのホリバーを終了し、JSコードの新しいバッチの検討を開始する時が来たと思います。

//       -  3  (        )     /** * Function insert DOM element before some element * * @version 2012-11-06 * @param Object new_element * @param Object targetElement * @return void */ function insertBefore(new_element, targetElement) { targetElement.parentNode.insertBefore(new_element, targetElement); } /** * Function insert DOM element after some element * * @version 2012-11-06 * @param Object new_element * @param Object targetElement * @return void */ function insertAfter(new_element, targetElement) { var parent = targetElement.parentNode; //if the parents lastchild is the targetElement... if(parent.lastchild == targetElement) parent.appendChild(new_element); else parent.insertBefore(new_element, targetElement.nextSibling); } /** * Function make clone of income object * * @version 2012-11-07 * @param Object obj * @return Object */ function clone(obj) { if(obj == null || typeof(obj) != 'object') return obj; var temp = {}; for(var key in obj) temp[key] = clone(obj[key]); return temp; } //    DOM   ,    /** * Function return next element in dom object * * @version 2013-01-08 * @param Object obj * @return Object */ function getNext(obj) { obj = obj.nextSibling; if(!obj) return false; while(obj.nodeType != 1){ obj = obj.nextSibling; if(!obj) return false; } return obj; } //    DOM   ,    /** * Function return previous element in dom object * * @version 2013-02-13 * @param Object obj * @return Object */ function getPrevious(obj) { obj = obj.previousSibling; if(!obj) return false; while(obj.nodeType != 1){ obj = obj.previousSibling; if(!obj) return false; } return obj; } //  2  -     Cookies. C ,  ,    /** * Function new Cookies * * @version 2013-03-26 * @param string name * @param string value * @param string expires * @param string path * @return void */ function setCookies(name, value, expires, path) { if(!name || !value) return 0; if(!expires){ expires = new Date(); expires.setTime(expires.getTime() + (1000 * 86400 * 365)); //save 1 year } if(!path) path = '/'; // set Cookies document.cookie = name+'='+escape(value)+'; expires='+expires.toGMTString()+'; path='+path; } /** * Function return Cookies value by name * * @version 2013-03-26 * @param string name * @return void */ function getCookies(name) { var results = document.cookie.match ( '(^|;) ?' + name + '=([^;]*)(;|$)' ); if ( results ) return ( unescape ( results[2] ) ); else return null; } //      //    Ajax(params),      prototype /** * Ajax object * * Send request by post/get to some url * * @version 2013-02-13 * @param Object params * @return Object */ window.Ajax = function(params) { //    this.options = { // default url url: '', // default method method: 'get', // Is synchronous request? async: true, // in seconds timeout: 10000, // callback function, in default - empty function onComplete: function(){} }; // set config params this.setConfig(params); //     XMLHttpRequest    // initialize this.init(params); }; /** * Pablic methods */ window.Ajax.prototype = { /** * some internal params */ xml_http_request: null, timeout: null, // json|xml|text response:'json', //   ajax ,     /** * configure functionality */ setConfig: function(opt) { // set url if(opt.url != undefined) this.options.url = opt.url; // set method if(opt.method != undefined) this.options.method = opt.method; // set asynchronus param if(opt.async != undefined) this.options.async = opt.async; // set timeout if(opt.timeout != undefined) this.options.timeout = opt.timeout; // set callback functions if((opt.onComplete != undefined) && (typeof(opt.onComplete) == 'function')) this.options.onComplete = opt.onComplete; }, /** * Initialize XMLHTTPRequest */ init: function() { //   XMLHttpRequest // Cross-browser compatibility for browsers if (typeof XMLHttpRequest != 'undefined') { this.xml_http_request = new XMLHttpRequest(); } else{ try { this.xml_http_request = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { this.xml_http_request = new ActiveXObject("Microsoft.XMLHTTP"); } catch (E) { alert('Your browser don\'t support Ajax technology. Please download real browser :)'); } } } var self_ = this; //   (post/get), url, /  // open XMLHttpRequest this.xml_http_request.open(self_.options.method, self_.options.url, self_.options.async); /**  callback    * *   readyState : * 0 - Unitialized * 1 - Loading * 2 - Loaded * 3 - Interactive * 4 - Complete *  0-2   . * * self_.xml_http_request.status -    (200, 404  ) */ // set callback function for XMLHttpRequest this.xml_http_request.onreadystatechange = function(){ if((self_.xml_http_request.readyState == 4) && (self_.xml_http_request.status > 0)){ //    Ajax  (  ) // delete timeout clearTimeout(self_.timeout); //    ,       // JSON.parse -   JSON (  - bye-bye) if(self_.response == 'json') var response = JSON.parse(self_.xml_http_request.responseText); else{ if(self_.response == 'xml') var response = self_.xml_http_request.responseXML; else var response = self_.xml_http_request.responseText; } //    self_.options.onComplete(response); } } }, //       ,        /** * Set some headers if need */ setRequestHeader: function(name, value) { this.xml_http_request.setRequestHeader(name, value); }, //  Ajax   /** * Send request */ send: function(params) { this.xml_http_request.send(params); var self_ = this; //     ,         -    //   - 10  ,     // set timeout need for abort request this.timeout = setTimeout( function(){ self_.xml_http_request.abort(); }, this.options.timeout); }, //    ,         ,     (     :) ) /** * Abort request */ abort: function() { this.xml_http_request.abort(); } }   Ajax(): new Ajax({ url: '/index.php', timeout: 20000, method: 'post', onComplete: function(data){ alert(data);} }).send('qwerty=123'); 

PS。 約束どおり、 ソース 。 この記事は、人々が真のJavaScriptを忘れず、力の明るい側面に行くように書かれました（Cookieもここにあります:)）。