Передача объекта JavaScript в функцию JQuery? - PullRequest
Новая
       6

Передача объекта JavaScript в функцию JQuery?

4 голосов
/ 23 июня 2010

Да, так что я некоторое время возился с javascript, но только недавно занялся такими вещами, как ориентация объектов, создание прототипов и использование объектов для всех функций и переменных.

Но, многие фреймворки, такие как jQuery или extJS, имеют кое-что, что я еще не понял, вы можете определить объект, используя встроенную функцию для поиска в dom, например: 

var a = $('#mydiv');

и затем вы можете сделать a.click (функция);

Итак, мой вопрос, как я могу создать своего рода «фреймворк», в котором я могу написать код в этом стиле, например: 

var mydiv = document.querySelector('mydiv');
mydiv.neph(args,args);

Итак, я определил свой объект, в данном случае это элемент dom или что-то еще, теперь я передаю его своей функции "neph" с аргументами, я хочу создать код, который позволит мне это сделать. Но так как mydiv не имеет никакой функции, он имеет только в этом случае право dom, поэтому mydiv.neph не существует, но в jquery вы можете определить любые var и .click или .mouseover или все, что существует внутри объекта, как функции ? Путаница наступает! : D

Хорошо, извините, если это запаздывающий вопрос. Кстати = P

Ответы [ 5 ]

1 голос
/ 23 июня 2010

Хороший ответ на комментарий Майка: посмотрите на источники jquery или Ext-Core.

Возможно, вам не хватает того, что в jquery, например, $ () возвращает объект jquery , который оборачивает простой ванильный DOM-узел, предоставляя расширенную функциональность.

1 голос
/ 23 июня 2010

jQuery и другие библиотеки определяют функцию с именем $, которая принимает несколько необязательных параметров.Объект, возвращаемый при вызове $, не является элементом DOM, но является объектом jQuery, оборачивающим элемент DOM набором удобных функций.

Вы можете сделать что-то подобное самостоятельно: 

<html>
   <body>
      <input id="derp" type="text"/>
<script type="text/javascript">

function $(id)
{
   return new myLibrary(id);
};

function myLibrary(id)
{
   this.el = document.getElementById(id);
};

myLibrary.prototype.help = function()
{
   alert(this.el.id);
   return this;
};

// Woah! My own fake jquery!
$("derp").help();
</script>

   </body>
</html>

jQuery, конечно, гораздо сложнее.Например, он будет использовать apply и вызовет для правильной установки this в вызовах, таких как jQuery.each.

1 голос
/ 23 июня 2010

Вам нужно создать прототип в javascript.Это то, что позволяет вам добавить функцию к уже определенному объекту (т.е. функцию .click (), которую вы привели в качестве примера).

Вы можете взглянуть на код jQuery , это с открытым исходным кодом.Это не самый простой код, но вы все еще можете увидеть, как он работает и как они это делают.

0 голосов
/ 24 июня 2010

Поскольку на самом деле никто не ответил про Ext, вы можете легко расширить прототип обёртки элемента: 

Ext.override(Ext.Element, {
    myMethod: function(a, b){
        console.log(a, b, this);
    }

});

«this» будет ссылаться на объект Ext.Element.

0 голосов
/ 23 июня 2010

В jQuery $ - это просто псевдоним объекта jQuery. Поэтому, когда вы вызываете $('#mydiv');, вы на самом деле вызываете функцию, подобную jQuery('#mydiv');. То, что делает jQuery таким классным, - это то, что каждая функция $() возвращает this, что означает, когда вы вызываете $() you получаем дескриптор объекта jQuery и всех методов, которые у него есть. Вот что позволяет вам сделать что-то вроде этого: 

var a = $('#mydiv');
a.click(function() { // etc etc etc });

Итак, выполним ваш пример: 

var mydiv = document.querySelector('mydiv');
mydiv.neph(args,args);

Вам нужно будет создать объект с функцией neph и вернуть этот объект в контексте mydiv при вызове querySelector. 

var myFramework = function() {
  this.context = undefined;
  this.neph = function(arg, args) {
    console.log(arg, args);
  }
};

var myCuteFunction = function(element) {
  var f = new myFramework();
  f.context = element;
  return f;
}

// ...

var x = myCuteFunction('#mydiv');
x.neph(arg, args);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...