Делегирование события

[Vlasenko Fedor]

Есть мнение что комментарии - признак плохого кода

Неправильное мнение. Так как система комментариев иногда используется для подсветки параметров в редакторах
А вот за a, b, c сразу на хлеб да воду сажать.

[ruslan_mart]

А вот за a, b, c сразу на хлеб да воду сажать.

Почему же? Если пишешь для кого-то, то - да, а если для себя - то ничего в этом плохого нет. Мне просто так удобнее писать, не нужно заморачиваться со всякими именами переменных и т.д., а главное - код получается меньше.

[melky]

danik.js, ну это то понятно, я оставляю комментарии около самих ф-ций, чтобы не вспоминать, что она означатает. Например: cA - это classAdd, eD - eventDelegate и т.д.

cA

ужас

зачем так мало?

Сам комментарии именно к коду никогда не использую, а если использую, то только когда заказщик попросит описать ему код.

ты для программистов код пишешь?

[ruslan_mart]

зачем так мало?

Ну что поделать, люблю ниндзить, когда пишу для себя.

ты для программистов код пишешь?

Программисты пусть сами себе код пишут, на то они и программисты.

[Vlasenko Fedor]

а главное - код получается меньше

для этого существуют компиляторы, упаковщики, сборщики и т. Д
http://closure-compiler.appspot.com/home
http://compressorrater.thruhere.net/
.................................................

[danik.js]

Неправильное мнение. Так как система комментариев иногда используется для подсветки параметров

Ну не об этом же речь. Без фанатизма. Речь как раз о таких вот примерах, как у Ruslan_xDD, когда лучше дать понятное имя функции и ее параметрам (а также локальным переменным), нежели писать поясняющие комментарии. Еще в JSDOC дается описание параметров, хотя чаще всего оно просто дублирует инфу, уже вложенную в имя самого параметра:

/**
     * Sets a new editsession to use. This method also emits the `'changeSession'` event.
     * @param {EditSession} session The new session to use
     *
     *
     **/
    this.setSession = function(session) {

[ruslan_mart]

Ладно, уговорили.

delegate: function(type, selector, callback) {
	this.event(type, function(event) {
		var target = event && event.target || w.event.srcElement;
		while(target != this) {
			if(matches.call(target, selector)) {
				callback.call(target, event);
				break;
			}
			target = target.parentNode;
		}
	});
	return this;
},
event: function(type, callback) {
	var self = this;
	if('addEventListener' in self) self.addEventListener(type, callback, false);
	else self.attachEvent('on' + type, function(event) {
		callback.call(self, event);
	});
	return this;
},

[nerv_]

А вот за a, b, c сразу на хлеб да воду сажать

от контекста зависит

Если пишешь для кого-то, то - да, а если для себя - то ничего в этом плохого нет

первый признак говнокодера

Мне просто так удобнее писать, не нужно заморачиваться со всякими именами переменных

если ты не можешь придумать имя переменной - это говорит об уровне кодера

[ruslan_mart]

если ты не можешь придумать имя переменной - это говорит об уровне кодера

Могу, просто я люблю ставить правильные имена, не всякие var data, ololo, sobitie и т.д., а именно правильные: callback, formRemove, setHelper и т.д. Но иногда бывает влом придумывать имя.

первый признак говнокодера

Не считаю себя говнокодером.

var d = document,
	h = d.documentElement,
	i, mk,
	w = window;

(function() {	
	mk = function(selector) {
		if('mk' in this) return mk.call(typeof selector == 'object' ? selector : d.querySelector(selector));
		for(i in _mk) this[i] = _mk[i];
		return this;
	};
	var XMLRequest = XMLHttpRequest || w.ActiveXObject && function() {
			return new ActiveXObject('Msxml2.XMLHTTP');
		},
		reqTimeout,
		classList = 'classList' in h,
		matches = h.matches || h.matchesSelector || h.webkitMatchesSelector || h.oMatchesSelector || h.mozMatchesSelector || h.msMatchesSelector || function(selector) {
     		var elems = this.parentNode.querySelectorAll(selector);
			for(i=0; i<elems.length; i++) if(elems[i] === this) return true;
		},
		_mk = {
			append: function() {
				var childs = arguments;
				for(i=0; i<childs.length; i++) this.appendChild(childs[i]);
				return this;
			},
			classAdd: function(name) {
				if(classList) this.classList.add(name);
				else this.className += this.classHas(name) ? '' : (this.className ? ' ' + name : name);
				return this;
			},
			classHas: function(name) {
				return classList ? this.classList.contains(name) : !!~(' ' + this.className + ' ').indexOf(' ' + name + ' ');
			},
			classRemove: function(name) {
				if(classList) this.classList.remove(name);
				else if(this.classHas(name)) this.className = this.className.replace(new RegExp(' ?' + name + ' ?'), '');
				return this;
			},
			classToggle: function(name) {
				if(classList) this.classList.toggle(name);
				else this.classHas(name) ? this.classRemove(name) : this.classAdd(name);
				return this;
			},
			delegate: function(type, selector, callback) {
				this.event(type, function(event) {
					var target = event && event.target || w.event.srcElement;
					while(target != this) {
						if(matches.call(target, selector)) {
							callback.call(target, event);
							break;
						}
						target = target.parentNode;
					}
				});
				return this;
			},
			effect: function(name, remove) {
				var self = this;
				self.classToggle('mk-' + name);
				if(remove) setTimeout(function() {
					self.remove();
				}, 500);
				return self;
			},
			event: function(type, callback) {
				var self = this;
				if('addEventListener' in self) self.addEventListener(type, callback, false);
				else self.attachEvent('on' + type, function(event) {
					callback.call(self, event);
				});
				return this;
			},
			props: function(props) {
				for(i in props) this[i] = props[i];
				return this;
			},
			query: function(selector) {
				return this.querySelector(selector);
			},
			remove: function() {
				this.parentNode.removeChild(this);
			},
		};
	
	mk.create = function(tagName, props) {
		var elem = d.createElement(tagName);
		mk(elem).props(props);
		return elem;
	};
	mk.message = function(icon, title, message, clicked) {
		var elem = mk.create('div', {className: 'mk-msg mk-show'}),
			img = mk.create('img', {align: 'left', alt: '', src: icon}),
			div = mk(mk.create('div')).append(mk.create('b', {textContent: title}), mk.create('span', {textContent: message})),
			params = arguments.callee;
		elem = mk(elem).append(img, div);
		mk('#mk-msgs').insertBefore(elem, params.len === 0 ? null : params.tmp);
		params.len = params.len + 1 || 1;
		params.tmp = elem;
		var timeout = setTimeout(elem.onclick = function() {
			elem.effect('show', true);
			params.len--;
			clearTimeout(timeout);
			if(clicked) clicked();
		}, 4E3);
		elem.clientWidth;
		elem.effect('show');
	};
	mk.request = function(url, params, callback, error) {
		var keys = [],
			req = new XMLRequest(),
			self = this;
		req.open('POST', url, true);
		req.onreadystatechange = function() {
			if(req.readyState != 4) return;
			clearTimeout(reqTimeout);
			if(req.status == 200) callback.call(self, req.responseText);
			else if(error) error(req.statusText);
		};
		req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
		for(i in params) keys.push(i + '=' + params[i]);
		req.send(keys.join('&') || null);
		reqTimeout = setTimeout(function() {
			req.abort();
			if(error) error();
		}, 5E3);
	};
})();

ТЕСТ!

На class* не знаю, ставить регулярку или оставить такой костыль?

И ещё вопрос: насколько кроссбраузерен будет XMLHttp запрос (mk.request)? Ничего не упустил?

[melky]

Есть мнение что комментарии - признак плохого кода. Хороший код должен быть понятен и без комментов. Как минимум нужно давать понятные имена переменным.

как workaround'ы делать без комментариев?
как хаки пояснять без комментариев?

это хороший код ... плохие браузеры\стандарты и плохое API