JavaScript Style Guide - jQuery

Jang Seok Woo·2022년 8월 12일
0

실무

목록 보기
123/136

26. jQuery

26.1 Prefix jQuery object variables with a $.

// bad
const sidebar = $('.sidebar');

// good
const $sidebar = $('.sidebar');

// good
const $sidebarBtn = $('.sidebar-btn');

26.2 Cache jQuery lookups.

// bad
function setSidebar() {
  $('.sidebar').hide();

  // ...

  $('.sidebar').css({
    'background-color': 'pink',
  });
}

// good
function setSidebar() {
  const $sidebar = $('.sidebar');
  $sidebar.hide();

  // ...

  $sidebar.css({
    'background-color': 'pink',
  });
}

26.3 For DOM queries use Cascading $('.sidebar ul') or parent > child $('.sidebar > ul'). jsPerf

26.4 Use find with scoped jQuery object queries.

// bad
$('ul', '.sidebar').hide();

// bad
$('.sidebar').find('ul').hide();

// good
$('.sidebar ul').hide();

// good
$('.sidebar > ul').hide();

// good
$sidebar.find('ul').hide();

출처 : https://github.com/airbnb/javascript

profile
https://github.com/jsw4215

0개의 댓글