Форум

Teamur · #1 (**permalink**) 01.07.2017, 09:54

Товарищи, вот то, что я смог сделать:

<div id='Elem'>Lorem</div>

И код:

var elem = document.getElementById('Elem');
var current = null;

Object.defineProperty(Element.prototype,'text',{
 get(){
  current = this.textContent;
  console.log(current);
  return '??????'  // возвращаем сеттер свойства 'text' для данного объекта (в данном случае для элемента)
 }
})

// Пример желаемого синтаксиса:
var txt = elem.text;

console.log(txt); // 'Lorem'

txt = 'Ipsum';  // 'Lorem -> Ipsum'

txt = 'Dolor'; // 'Ipsum -> Dolor'

txt.free();  // 'variable 'txt' is free now'

Что должен вернуть геттер, чтобы я потом мог присваивать
новый текст элементу 'elem', согласно приведенному синтаксису.
Предположу что объект или функцию, но ведь, наверное, не существует сеттера самого объекта.

Возможно Javascript не может возвращать свойство, а лишь его значение. Бывают ли безымянные свойства? Хрен знает ))

Приведенный синтаксис позволит упростить и сократить код.
Иначе будет:

elem.text = 'Ipsum';
elem.text = 'Dolor';
elem.text = 'Sit Amet'
//...Дублирование кода ( повторение 'elem.text' сто раз ) ((

Тут мы каждый раз получаем свойство для того чтобы поменять его значение.
Мне же нужно ОДИН РАЗ получить свойство, а затем сетить(задавать) его значение, пока не надоест

Я же предлагаю просто присваивать переменной новое значение
и то (нап. функция), что следит за этой переменной будет менять содержимое 'elem' согласно присвоенному значению.
То есть мы как бы привязываем переменную под нужное СВОЙСТВО до тех пор пока не введем: somevar.free()

Возможно ли это?
Что должен вернуть геттер, чтобы реализовать указанный синтаксис?

рони · #2 (**permalink**) 01.07.2017, 11:01

Teamur,
возможно не window а Element.prototype, это так на всякий.

Teamur · #3 (**permalink**) 01.07.2017, 11:04

рони,
спасибо что заметили, это я опечатался, конечно Element.prototype, но!
Дальше все равно не знаю что делать.

рони · #4 (**permalink**) 01.07.2017, 11:08

Teamur,
тоже не знаю как сократить elem.text до txt

Teamur · #5 (**permalink**) 01.07.2017, 11:15

рони,
Если я в геттере свойства 'text' верну текст элемента:

return this.textContent

, то у меня в переменной 'txt' будет храниться строка, и всё - тупик.
И как бы я ни старался присваивая строке другую строку, в данном случае 'Ipsum', содержимое элемента не изменится.

Геттер должен вернуть СВОЙСТВО, а не его значение, чтобы я смог задать новое значение.
Вот в чем суть вопроса. Спасибо

EmperioAf · #6 (**permalink**) 01.07.2017, 18:41

function getSetter(obj, prop) {
  return function (value) {
    obj[prop] = value; 
  };
}

var example = { text: 'Hello'};

var setExampleText = getSetter(example, 'text');
console.log(example ); // {text: "Hello"}
setExampleText('Hello World');
console.log(example ); //{text: "Hello World"}

Malleys · #7 (**permalink**) 01.07.2017, 18:42

Сеттер нужен наверное...

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>html{font:2em sans-serif;}</style>
</head>
<body>
	<div id="lorem"></div>
	<script>
function createSetter(element, variable, context) {
	Object.defineProperty(context || self, variable, {
		set: function(value) {
			console.log(value);

			let x = Symbol.for("textContentPromise");
			let promise = element[x] || Promise.resolve();

			element[x] = promise.then(() => {
				return new Promise(resolve => {
					setTimeout(() => resolve(element.textContent = value), 200);
				});
			});
		}
	});
}

createSetter(lorem, "text");
text = "lorem";
text = "ipsum";
text = "dolor";
text = "sit";
text = "amet";
text = "Rise";
text = "как";
text = "видишь";
text = "заметно";
text = "и";
text = "на";
text = "обычном";
text = "компе";
text = "lorem";
text = "ipsum";
text = "dolor";
text = "sit";
text = "amet";

	</script>
</body>
</html>

Teamur · #8 (**permalink**) 01.07.2017, 23:24

Такой тупизм (см. ниже цепочку), я могу легко сократить до Было-стало, сразу задав конечное значение, НО!

txt='Ipsum',
txt='Dolor',
txt='Sit Amet'

такая непрерывная Цепочка была записана для понимания идеи.

На самом деле между этими строками может быть любой другой код!
Все это придумано для того, чтобы я по ходу написания функции не дублировался сто раз, получая каждый раз свойство заново.
Я подумал, что было бы круто, например, в начале функции получить требуемое свойство, в данном случае 'text', и использовать его много раз, не дублируя код!
Реальный код будет конечно не таким, как тупизм выше, например:

function Handler(){
 let txt = elem.text;
 console.log('Поехали');
 txt = 'Ipsum'; // *
 let div = document.createElement('div');
 div.dataset.type = 'toolbar';
 elem.after(div);
 txt = 'Dolor';  // *
 div.append('Приехали');
 txt = 'Sit Amet'  // *
}

Как видим между строками со звездочкой есть другой код! ))
Поэтому нужна привязка к свойству, а не значению.

Teamur · #9 (**permalink**) 02.07.2017, 11:58

Мне же просто нужно один раз сохранить в переменной свойство,
чтобы не получать его каждый раз заново.
Не понимаю почему зашла речь о синхронности и тп.

Это максимум, что я могу вам показать, чтобы поддержать тему:

Node.prototype.bind = function(varName, propName) {
  let elem = this;
  Object.defineProperty(window,varName,{
    get() {
      console.log('-> '+elem[propName]);
      varName = elem[propName];
    },
    set(newVal) {
      elem[propName] = newVal;
      console.log(elem[propName]+' -> '+newVal);
      varName = elem[propName]
    }
  });
  this.free = function() { // Тут что-то напутал (
   varName = null;
   console.log('var '+varName+' is FREE now!');
  }
}

<div id='Elem'>Lorem</div>

Юзаж:

let elem = document.getElementById('Elem');

elem.bind('txt','textContent');

console.log(txt);  // -> Lorem

if (elem.style.color == '#000') {
  txt = 'Ipsum'; // Lorem -> Ipsum
}
else {
  txt = 'Dolor'; // Ipsum -> Dolor
};

txt.free(); // var txt is FREE now!

console.log(txt) // null

Надеюсь на вашу помощь, спасибо!

Teamur · #10 (**permalink**) 02.07.2017, 16:35

Rise,
Отлично!

Блин, зря я написал условный оператор, забудем о нём.
Он мне нахрен не нужен )). Опять же я хотел показать, что между сеттингом нового значения может быть что угодно.

Форум

Справочник

Discord чат

Курсы javascript