Служебные функции

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

Функция $.extend

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

var defaults = {color: 'red', size: 'medium'};
var options = {size: 'large', weight: 'bold'};
var settings = $.extend({}, defaults, options);
// settings = {color: 'red', size: 'large', weight: 'bold'}
  • Первый аргумент — объект, в который будут копироваться свойства.
  • Если передать true первым аргументом, будет выполнено глубокое копирование, включая вложенные объекты.
var obj1 = {a: {x: 1}};
var obj2 = {a: {y: 2}};
var result = $.extend(true, {}, obj1, obj2);
// result = {a: {x: 1, y: 2}}

Функция $.each

$.each используется для итерации по массивам и объектам. Она схожа с нативными for...in и forEach, но обеспечивает единый интерфейс для обоих типов коллекций.

$.each([1, 2, 3], function(index, value) {
    console.log(index, value);
});

$.each({name: 'John', age: 30}, function(key, value) {
    console.log(key, value);
});
  • Возврат false из callback прекращает цикл.
  • Поддерживает псевдомассивы, что удобно для работы с NodeList.

Функция $.map

$.map позволяет трансформировать массивы и объекты, возвращая новый массив с результатами функции.

var arr = [1, 2, 3];
var squared = $.map(arr, function(val) { return val * val; });
// squared = [1, 4, 9]

Особенность: если callback возвращает null или undefined, элемент исключается из результирующего массива.

Функция $.proxy

$.proxy используется для привязки контекста this к функции. Это полезно при работе с обработчиками событий.

var obj = {name: 'Zepto'};
function greet() { console.log(this.name); }

var bound = $.proxy(greet, obj);
bound(); // вывод: Zepto
  • Альтернатива Function.prototype.bind, но более компактная и совместимая с Zepto.

Функция $.trim

$.trim обрезает пробелы в начале и конце строки, что упрощает работу с пользовательским вводом.

var str = "   hello world  ";
var trimmed = $.trim(str);
// trimmed = "hello world"
  • Работает с любыми пробельными символами, включая \n, \t и \r.

Функция $.isFunction и родственные методы

Zepto предоставляет утилиты для проверки типов:

$.isFunction(function(){}); // true
$.isArray([1,2]);           // true
$.isPlainObject({a:1});     // true
$.isWindow(window);         // true
  • $.isFunction проверяет, является ли объект функцией.
  • $.isArray проверяет массивы.
  • $.isPlainObject определяет объекты, созданные с помощью {} или new Object(), исключая DOM-элементы и встроенные объекты.
  • $.isWindow проверяет, является ли объект глобальным объектом окна.

Функция $.contains

$.contains проверяет, является ли один элемент родителем другого.

var parent = document.getElementById('parent');
var child = document.getElementById('child');

$.contains(parent, child); // true или false
  • Удобно при работе с вложенными DOM-структурами и проверкой отношений элементов.

Функция $.type

$.type возвращает точный тип объекта в виде строки:

$.type(null);       // "null"
$.type([]);         // "array"
$.type({});         // "object"
$.type(/abc/);      // "regexp"
  • Отличается от typeof, который возвращает "object" для массивов и null.

Функция $.noop

$.noop — пустая функция, используется как заглушка для callback-ов.

$.noop(); // ничего не делает
  • Применяется в местах, где callback обязателен, но выполнять его нет необходимости.

Функция $.parseJSON

$.parseJSON преобразует JSON-строку в объект.

var obj = $.parseJSON('{"name":"Zepto"}');
// obj = {name: "Zepto"}
  • Используется для совместимости с устаревшими браузерами, где JSON.parse может отсутствовать.

Функция $.camelCase

$.camelCase конвертирует CSS-свойства из дефисной записи в camelCase.

$.camelCase('background-color'); // "backgroundColor"
  • Полезно при манипуляциях со стилями через JavaScript.

Особенности внутреннего использования

Многие служебные функции Zepto оптимизированы для скорости и малых размеров:

  • Используются в методах $.fn для манипуляции DOM.
  • Применяются в обработке событий (on, off, trigger).
  • Позволяют легко расширять Zepto без значительного увеличения веса библиотеки.

Заключение о служебных функциях

Служебные функции Zepto обеспечивают унифицированный, компактный и кросс-браузерный интерфейс для:

  • работы с объектами и массивами,
  • обработки строк,
  • проверки типов и контекста,
  • DOM-операций.

Их использование позволяет сократить объём кода, повысить читаемость и упростить создание собственных модулей на основе Zepto.

Оглавление