Введение

С тех пор, как на сцену вышли компоненты Lightning, разработчикам экосистемы Salesforce можно простить предположение, что Visualforce теперь является устаревшей технологией и что все новые разработки должны выполняться в Lightning. На мой взгляд, это чересчур черно-белое - хотя, вероятно, Lightning получит львиную долю внимания со стороны Salesforce, а Visualforce, скорее всего, получит обслуживание, а не новые функции, Visualforce - это зрелая технология, которая используется миллионами. приложений по всему миру, так что он не исчезнет в ближайшее время.

Также нет причин предполагать, что компании откажутся от инвестиций в Visualforce и перестроят все свои приложения в Lightning - я всегда советую клиентам не делать этого, если нет веской причины. В противном случае требуются значительные вложения, и наилучшим возможным результатом будет то, что пользователи не заметят никакой разницы, в то время как более вероятный результат состоит в том, что что-то работает не совсем так, как они, или совсем не работает!

Другая причина, по которой я считаю это предположение ошибочным, заключается в том, что оно предполагает, что все разработчики Visualforce могут легко перейти на Lightning с минимальными усилиями. Хотя это может быть правдой для таких людей, как я, которые занимаются программированием почти 40 лет, это определенно не относится к тем, кто самостоятельно обучился Apex и Visualforce, создавая приложения с помощью и поддержкой сообщества Salesforce. . В большинстве случаев это единственное программирование, которым занимались эти люди, поэтому перейти на другой язык не так-то просто, особенно на JavaScript! Свободная типизация, замыкания, функции как объекты первого класса и прототипы - совершенно чуждые концепции, если вы привыкли только к строго типизированному статически компилируемому языку, например Apex.

Тем не менее, я, безусловно, посоветовал бы разработчикам Salesforce начать знакомство с JavaScript, но это намного проще, если делать это в знакомой среде Visualforce, позволяя серверу выполнять большую часть тяжелой работы. Однако такой подход - не панацея, поэтому вот несколько советов, основанных на моем собственном опыте.

Найдите время и изучите JavaScript

Вам не нужно становиться экспертом, но если вы попытаетесь собрать что-то вместе, используя фрагменты кода других людей, вы обнаружите, что это упражнение разочаровывает. JavaScript сильно отличается от того, к чему вы привыкли, и выяснение того, почему следующий код выполняется немедленно, а затем выдает ошибку «Uncaught ReferenceError: example is not defined», может занять некоторое время.

(function example(){
   alert('In example!');
}());
example();

В Интернете есть масса ресурсов по JavaScript, и я слышал очень хорошие отзывы от людей, которые использовали Школу кода для начала. Я всегда предпочитаю книги, и я обнаружил, что именно Объектно-ориентированный JavaScript от Стояна Стефанова заставил меня все щелкнуть. Ваш опыт почти наверняка будет разным, но определенно стоит потратить время на то, чтобы найти правильный метод обучения, а затем применить его.

Отделить JavaScript от HTML

Ненавязчивый JavaScript требует отделения кода JavaScript от разметки презентации, что означает отсутствие привязки обработчиков событий непосредственно к элементам HTML, например:

<input type="text" id="firstname" onchange="copyToLastname()" />

Если вы это сделаете, разработчик, который придет после вас, должен будет просмотреть всю вашу разметку, а также ваш JavaScript, чтобы выяснить, где можно использовать функцию. Вместо этого добавление обработчика к элементу программно помогает прояснить ситуацию, хотя и за счет дополнительной строки кода - ваши будущие коллеги будут благодарны вам за то, что вы нашли время!

document.getElementById('firstname').onchange = copyToLastName;

(в стороне, это пример того, как функции являются объектами первого класса в JavaScript - я определил copyToLastName в другом месте и могу просто назначить его как функцию onchange для элемента firstname).

Избегайте синтаксиса слияния Visualforce в JavaScript

Очень заманчиво сделать что-то вроде следующего, чтобы вставить значение из контроллера Visualforce непосредственно в ваш JavaScript:

var firstname=’{!Contact.FirstName}’;

что кажется довольно безобидным. Однако эта, казалось бы, невинная строка кода тесно связывает ваш JavaScript с механизмом рендеринга Visualforce - если JavaScript не обрабатывается механизмом рендеринга, синтаксис слияния будет восприниматься как строковый литерал и везде, где вы используете свойство firstname будет отображать {!Contact.FirstName}, а не настоящее имя контакта.

Я слышал, вы спросите, почему это так важно? Чтобы минимизировать время загрузки страницы, вы обычно хотите переместить JavaScript в статический ресурс, чтобы его можно было включить как внешний файл после завершения разработки. Это позволяет браузеру кэшировать внешний файл, а это означает, что JavaScript не нужно доставлять каждый раз, когда пользователь обращается к странице. Внешние файлы включаются после того, как страница Visualforce доставляется в браузер, что означает, что они обрабатываются только браузером, а не механизмом визуализации Visualforce.

Как следствие, я всегда советую разрабатывать JavaScript в собственном компоненте Visualforce. Это позволяет отделить его от разметки страницы, но при этом доставлять его как часть страницы, чтобы упростить отладку. Как только вы убедитесь, что все работает должным образом (да, верно!), Легко перенести это на статический ресурс.

Избегайте анонимных функций

Раньше я говорил об этом во многих своих статьях и презентациях, но всегда стоит повторить - используйте анонимные функции как можно реже. Для тех, кто плохо знаком с JavaScript (и я ожидаю, что некоторые из вас это прочитают), вот анонимная функция:

doRequest(function(response){
    console.log('Got response ' + response);
});

Что само по себе выглядит неплохо. Начните добавлять больше бизнес-логики, и все быстро испортится:

doRequest(function(response){
    console.log('Got response ' + response);
    if (response=='OK') {
        doSecondRequest(response, function(nextResponse){
            console.log('Got response ' + nextResponse);
        });
    }
    else {
        handleError(response, function(okStatus) {
            console.log('Handled error okay');
                     }),
                     function(errorStatus) {
            console.log('Unable to handle error');
                     } 
        );
    }
});

В реальном мире, где бизнес-логика больше, чем в простых операторах console.log, когда вы получаете исключение в анонимной функции, вложенной в несколько других анонимных функций, практически невозможно выяснить, что на самом деле произошло. Я знаю это, потому что одно из моих ранних начинаний с JavaScript, Ticket to Ride,

Я попал именно в такую ​​ситуацию. Я извлек некоторые данные с сервера, обработал ответ анонимной функцией, а затем выполнил ряд асинхронных функций для сохранения в автономном режиме и последующего запроса обратно, обрабатывая все ответы с помощью дополнительных анонимных функций. Примерно за неделю до пробного запуска я лихорадочно все переписывал!

Не загрязняйте глобальное пространство имен

Если вы объявите переменные в JavaScript, как показано ниже, все они будут добавлены в глобальное пространство имен:

var x=1;
var y=2;
var length=3;
var count=7;

Глобальное пространство имен - это объект window, поэтому фактически эти объявления:

window.x=1;
window.y=2;
window.length=3;
window.count=7

Глобальное пространство имен window используется всем JavaScript на вашей странице. Таким образом, если вы включили другой файл JavaScript, который объявляет:

var count='This is the counter';

Оба объявления присваивают значения window.count, и один файл JavaScript будет разочарован, когда он подействует на это и обнаружит, что он внезапно стал неправильным типом.

Вместо этого создайте объекты, специфичные для вашего JavaScript, и заключите переменные внутри этих объектов. У вас все еще есть шанс столкнуться с объектом из другого файла JavaScript, но разумное соглашение об именах должно смягчить это:

var bgAppObj={
    x : 1,
    y : 2,
    length : 3,
    count : 7
};

Использовать их так же просто, как указать имя объекта перед переменной:

console.log('Length = ' + bgAppObj.length);
bgAppObj.count+=3;

Таким образом, даже если другой файл JavaScript указывает переменную count в глобальном пространстве имен, ваши переменные хорошо изолированы в контейнере и не подвержены влиянию.

Это все, что нужно сделать?

Верьте этому, и вы поверите во что угодно. Язык JavaScript развивается - поддержка ES6 постепенно добавляется в браузеры, ES7 дорабатывается, фреймворки растут быстрее, чем цены на жилье, и падают быстрее, чем репутация политиков, а JavaScript на сервере через Узел становится все сильнее . Начало работы с JavaScript означает, что вы открываете для себя массу новых знаний, но это будущее, и лучше всего начать как можно раньше.

В сообществе Salesforce я более известен как Боб Баззард - множество сертификатов, в том числе технический архитектор, 5 x MVP и технический директор BrightGen, партнера Platinum Cloud Alliance в Соединенном Королевстве, которые нанимают.



Карьера в Brightgen | Brightgen
На протяжении 10 лет организации полагались на BrightGen, чтобы показать им, на что способна Salesforce и их бизнес… www.brightgen.com



Вы можете найти мои (обычно) более технические мысли в Блоге Боба Баззарда