JavaScript-библиотека RightJS для повседневного использования [закрыто]

Основываясь на документации, примерах кода и том, что уже находится в разработке для RightJS 2, я очень впечатлен.

@Patrick. Спасибо, что указали на функцию Вызов по имени в RightJS, которая кажется чрезвычайно полезной для удаления большинства анонимных функций со всей страницы. Для тех, кто не знаком с этим, идея состоит в том, чтобы указать имя метода и аргументы в качестве параметров вместо создания анонимного обратного вызова. Например, если мы пытаемся отфильтровать все слова и фразы, начинающиеся с «привет», из массива,

var words = ['stack', 'hello world', 'overflow', 'hello there'];

Используя метод filter для массивов, мы должны написать:

words.filter(function(word) {
    return word.indexOf('hello') === 0;
});

Мы можем написать то же самое, используя Call By Name. в RightJS как,

words.filter('startsWith', 'hello');

Довольно мило, а?

Мне также нравится идея прямого использования строк в качестве селекторов.Хотя RightJS делает это только для делегирования событий на данный момент, но я хотел бы иметь возможность полностью избавиться от функции $ для большинства целей и напрямую вызывать методы для строки. Например, чтобы прослушивать все клики по любому параграфу на странице, напишите:

'p'.on('click', function() {
    this.addClass('clicked');
});

Или, может быть, совместите это с вызовом по имени,

'p'.on('click', 'addClass', 'clicked');

В RightJS 2 мне нравится возможность использовать виджеты в качестве нативных элементов. .

var calendar = new Calendar();

calendar instanceof Calendar; // true
calendar instanceof Element; // true

Спасибо @patrick и @Nikolay за уточнение моего предположения. Виджет будет обертывать собственный элемент DOM, который доступен как свойство _ объекта.

document.body.appendChild(calendar._);

или используйте методы, предоставляемые платформой.

calendar.insertTo(document.body)

Еще одна приятная функция — унифицированный способ инициализации виджетов с использованием только декларативного синтаксиса:

<input data-calendar="{format: 'US', hideOnClick: true}" />

вместо того, чтобы создавать объект самостоятельно и затем добавлять его на страницу:

var calendar = new Calendar({
    format: 'US',
    hideOnClick: true
});

calendar.insertTo(document.body);

Я взял слайды из презентации под названием Обзор библиотеки JavaScript Джона Резига и сравнение примеров кода для jQuery с RightJS. В этих примерах в основном сравнивается базовый синтаксис для обеих платформ, который больше похож, чем отличается, хотя RightJS кажется более гибким в своем использовании.

Обход DOM

jQuery

$('div > p:nth-child(odd)')

RightJS

$$('div > p:nth-child(odd)')

Модификация DOM

jQuery

$('#list').append('<li>An Item</li>')

RightJS

$('list').insert('<li>An Item</li>')

События

jQuery

$('div').click(function() {
    alert('div clicked')'
});

RightJS

$$('div').onClick(function() {
    alert('div clicked');
});

AJAX

jQuery

$.get('test.html', function(html) {
    $('#results').html(html);
});

или

$('#results').load('test.html');

RightJS

Xhr.load('test.html', {
    onSuccess: function(request) {
        $('#results').html(request.text);
    }
}).send();

или

$('results').load('test.html');

Анимации

jQuery

$('#menu').animate({ opacity: 1 }, 600);

RightJS

$('menu').morph({ opacity: 1 }, { duration: 600 });

Обход массива

jQuery

$.each(myArray, function(index, element) {
    console.log(element);
});

RightJS

myArray.each(function(element) {
    console.log(element);
});