Hướng dẫn switch case vs if-else javascript - chuyển đổi trường hợp so với if-else javascript

Các bạn tôi có một vài câu hỏi:

1. Có sự khác biệt về hiệu suất trong JavaScript giữa câu lệnh switch và if...else không?
2. Nếu vậy tại sao?
3. Là hành vi của switch và if...else khác nhau trên các trình duyệt? (Firefox, IE, Chrome, Opera, Safari)

Lý do để đặt câu hỏi này là có vẻ như tôi có được hiệu suất tốt hơn trong một tuyên bố switch với các trường hợp khoảng 1000s trong Firefox.

---

Được chỉnh sửa một cách khó chịu Đây không phải là mã của tôi, JavaScript đang được sản xuất máy chủ từ một thư viện được biên dịch và tôi không có quyền truy cập vào mã. Phương pháp sản xuất JavaScript được gọi là Unfortuantly this is not my code the Javascript is being produced serverside from a compiled library and I have no access to the code. The method that is producing the javascript is called

CreateConditionals(string name, string arrayofvalues, string arrayofActions)

Lưu ý

function [name] (value) {
  if (value == [value from array index x]) {
     [action from array index x]
  }
}

0 là một danh sách phân tách dấu phẩy.

Những gì nó sản xuất là

function [name] (value) {
  if (value == [value from array index x]) {
     [action from array index x]
  }
}

Lưu ý: Trường hợp

function [name] (value) {
  if (value == [value from array index x]) {
     [action from array index x]
  }
}

1 = tên được chuyển vào hàm serverside

Bây giờ tôi đã thay đổi đầu ra của hàm được chèn vào Textarea, đã viết một số mã JavaScript để phân tích thông qua hàm và chuyển đổi nó thành một tập hợp các câu lệnh

function [name] (value) {
  if (value == [value from array index x]) {
     [action from array index x]
  }
}

2.

Cuối cùng tôi chạy chức năng và nó chạy tốt nhưng hiệu suất khác nhau ở IE và Firefox.

Danwellman

8.8198 Huy hiệu vàng60 Huy hiệu bạc87 Huy hiệu đồng8 gold badges60 silver badges87 bronze badges

Khi được hỏi ngày 27 tháng 5 năm 2010 lúc 16:30May 27, 2010 at 16:30

John Hartsockjohn HartsockJohn Hartsock

83.7K23 Huy hiệu vàng127 Huy hiệu bạc146 Huy hiệu đồng23 gold badges127 silver badges146 bronze badges

4

Trả lời nói chung:

1. Vâng, thường.
2. Xem thêm thông tin ở đây
3. Có, bởi vì mỗi người có một công cụ xử lý JS khác nhau, tuy nhiên, khi chạy thử nghiệm trên trang web bên dưới, công tắc luôn thực hiện nếu, nếu không trên một số lượng lớn các lần lặp.

Trang web thử nghiệm

Fcmam5

1.58115 huy hiệu bạc23 Huy hiệu đồng15 silver badges23 bronze badges

Đã trả lời ngày 27 tháng 5 năm 2010 lúc 16:37May 27, 2010 at 16:37

17

Đôi khi tốt hơn là không sử dụng. Ví dụ, trong tình huống "công văn", JavaScript cho phép bạn làm mọi thứ theo một cách hoàn toàn khác:

function dispatch(funCode) {
  var map = {
    'explode': function() {
      prepExplosive();
      if (flammable()) issueWarning();
      doExplode();
    },

    'hibernate': function() {
      if (status() == 'sleeping') return;
      // ... I can't keep making this stuff up
    },
    // ...
  };

  var thisFun = map[funCode];
  if (thisFun) thisFun();
}

Thiết lập phân nhánh nhiều chiều bằng cách tạo một đối tượng có rất nhiều lợi thế. Bạn có thể thêm và xóa chức năng một cách linh hoạt. Bạn có thể tạo bảng công văn từ dữ liệu. Bạn có thể kiểm tra nó theo chương trình. Bạn có thể xây dựng các trình xử lý với các chức năng khác.

Có chi phí thêm của một cuộc gọi chức năng để đạt được tương đương với "trường hợp", nhưng lợi thế (khi có rất nhiều trường hợp) của một bộ tra cứu băm để tìm chức năng cho một khóa cụ thể.

Đã trả lời ngày 27 tháng 5 năm 2010 lúc 16:48May 27, 2010 at 16:48

POINTYPOODTYPointy

396K59 Huy hiệu vàng576 Huy hiệu bạc607 Huy hiệu Đồng59 gold badges576 silver badges607 bronze badges

2

Sự khác biệt về hiệu suất giữa switch và

function [name] (value) {
  if (value == [value from array index x]) {
     [action from array index x]
  }
}

4 là nhỏ, về cơ bản chúng thực hiện cùng một công việc. Một sự khác biệt giữa chúng có thể tạo ra sự khác biệt là biểu thức để kiểm tra chỉ được đánh giá một lần trong switch trong khi nó được đánh giá cho mỗi

function [name] (value) {
  if (value == [value from array index x]) {
     [action from array index x]
  }
}

6. Nếu nó tốn kém để đánh giá biểu thức, tất nhiên là làm điều đó nhanh hơn so với thực hiện nó hàng trăm lần.

Sự khác biệt trong việc thực hiện các lệnh đó (và tất cả tập lệnh nói chung) khác nhau khá nhiều giữa các trình duyệt. Nó là phổ biến để thấy sự khác biệt về hiệu suất khá lớn cho cùng một mã trong các trình duyệt khác nhau.

Vì bạn khó có thể kiểm tra hiệu suất tất cả các mã trong tất cả các trình duyệt, bạn nên sử dụng mã phù hợp nhất với những gì bạn đang làm và cố gắng giảm số lượng công việc thực hiện thay vì tối ưu hóa cách thực hiện.

Đã trả lời ngày 27 tháng 5 năm 2010 lúc 16:53May 27, 2010 at 16:53

GuffaguffaGuffa

675K108 Huy hiệu vàng723 Huy hiệu bạc996 Huy hiệu Đồng108 gold badges723 silver badges996 bronze badges

1

Câu trả lời của Pointy cho thấy việc sử dụng một đối tượng theo nghĩa đen thay thế cho switch hoặc ________ 16/________ 19. Tôi cũng thích cách tiếp cận này, nhưng mã trong câu trả lời tạo ra một đối tượng

function dispatch(funCode) {
  var map = {
    'explode': function() {
      prepExplosive();
      if (flammable()) issueWarning();
      doExplode();
    },

    'hibernate': function() {
      if (status() == 'sleeping') return;
      // ... I can't keep making this stuff up
    },
    // ...
  };

  var thisFun = map[funCode];
  if (thisFun) thisFun();
}

0 mới mỗi khi hàm

function dispatch(funCode) {
  var map = {
    'explode': function() {
      prepExplosive();
      if (flammable()) issueWarning();
      doExplode();
    },

    'hibernate': function() {
      if (status() == 'sleeping') return;
      // ... I can't keep making this stuff up
    },
    // ...
  };

  var thisFun = map[funCode];
  if (thisFun) thisFun();
}

1 được gọi là:

function dispatch(funCode) {
  var map = {
    'explode': function() {
      prepExplosive();
      if (flammable()) issueWarning();
      doExplode();
    },

    'hibernate': function() {
      if (status() == 'sleeping') return;
      // ... I can't keep making this stuff up
    },
    // ...
  };

  var thisFun = map[funCode];
  if (thisFun) thisFun();
}

Nếu

function dispatch(funCode) {
  var map = {
    'explode': function() {
      prepExplosive();
      if (flammable()) issueWarning();
      doExplode();
    },

    'hibernate': function() {
      if (status() == 'sleeping') return;
      // ... I can't keep making this stuff up
    },
    // ...
  };

  var thisFun = map[funCode];
  if (thisFun) thisFun();
}

0 chứa một số lượng lớn các mục, điều này có thể tạo ra chi phí đáng kể. Tốt hơn là chỉ cần thiết lập bản đồ hành động một lần và sau đó sử dụng bản đồ đã được tạo mỗi lần, ví dụ:

var actions = {
    'explode': function() {
        prepExplosive();
        if( flammable() ) issueWarning();
        doExplode();
    },

    'hibernate': function() {
        if( status() == 'sleeping' ) return;
        // ... I can't keep making this stuff up
    },
    // ...
};

function dispatch( name ) {
    var action = actions[name];
    if( action ) action();
}

Đã trả lời ngày 26 tháng 7 năm 2017 lúc 20:29Jul 26, 2017 at 20:29

Michael Gearymichael GearyMichael Geary

28K9 Huy hiệu vàng63 Huy hiệu bạc75 Huy hiệu Đồng9 gold badges63 silver badges75 bronze badges

Khác với cú pháp, một công tắc có thể được thực hiện bằng cách sử dụng một cây làm cho nó

function dispatch(funCode) {
  var map = {
    'explode': function() {
      prepExplosive();
      if (flammable()) issueWarning();
      doExplode();
    },

    'hibernate': function() {
      if (status() == 'sleeping') return;
      // ... I can't keep making this stuff up
    },
    // ...
  };

  var thisFun = map[funCode];
  if (thisFun) thisFun();
}

3, trong khi A nếu/khác phải được thực hiện với cách tiếp cận thủ tục

function dispatch(funCode) {
  var map = {
    'explode': function() {
      prepExplosive();
      if (flammable()) issueWarning();
      doExplode();
    },

    'hibernate': function() {
      if (status() == 'sleeping') return;
      // ... I can't keep making this stuff up
    },
    // ...
  };

  var thisFun = map[funCode];
  if (thisFun) thisFun();
}

4. Thường xuyên hơn cả hai đều được xử lý theo thủ tục và sự khác biệt duy nhất là cú pháp, và hơn nữa, điều đó có thực sự quan trọng - trừ khi bạn gõ các trường hợp 10k là nếu/cách khác?

Đã trả lời ngày 27 tháng 5 năm 2010 lúc 16:42May 27, 2010 at 16:42

Evan Carrollevan CarrollEvan Carroll

74.2K44 Huy hiệu vàng244 Huy hiệu bạc431 Huy hiệu Đồng44 gold badges244 silver badges431 bronze badges

4

1. Nếu có sự khác biệt, nó sẽ không bao giờ đủ lớn để được chú ý.
2. N/A
3. Không, tất cả chúng đều hoạt động giống hệt nhau.

Về cơ bản, sử dụng bất cứ điều gì làm cho mã dễ đọc nhất. Chắc chắn có những nơi mà một hoặc các cấu trúc khác làm cho sạch hơn, dễ đọc hơn và dễ bảo trì hơn. Điều này quan trọng hơn nhiều là có lẽ tiết kiệm một vài nano giây trong mã JavaScript.

Đã trả lời ngày 27 tháng 5 năm 2010 lúc 16:36May 27, 2010 at 16:36

Jon Benedictojon BenedictoJon Benedicto

10,4K3 Huy hiệu vàng27 Huy hiệu bạc 30 Huy hiệu Đồng3 gold badges27 silver badges30 bronze badges

9

Có một sự khác biệt về tiền hiệu trong JavaScript giữa một câu lệnh chuyển đổi và nếu ... khác nếu .... khác?

Tôi không nghĩ vậy, switch rất hữu ích/ngắn nếu bạn muốn ngăn chặn nhiều điều kiện

function dispatch(funCode) {
  var map = {
    'explode': function() {
      prepExplosive();
      if (flammable()) issueWarning();
      doExplode();
    },

    'hibernate': function() {
      if (status() == 'sleeping') return;
      // ... I can't keep making this stuff up
    },
    // ...
  };

  var thisFun = map[funCode];
  if (thisFun) thisFun();
}

6.

Là hành vi của chuyển đổi và nếu ... khác nếu ... khác khác nhau trên các trình duyệt? (Firefox, IE, Chrome, Opera, Safari)

Hành vi giống nhau trên tất cả các trình duyệt :)

Đã trả lời ngày 27 tháng 5 năm 2010 lúc 16:35May 27, 2010 at 16:35

SarfrazsarfrazSarfraz

372K76 Huy hiệu vàng529 Huy hiệu bạc576 Huy hiệu Đồng76 gold badges529 silver badges576 bronze badges

1

1. Việc làm việc có thể dẫn đến một số khác biệt rất nhỏ trong một số trường hợp nhưng cách xử lý là phụ thuộc vào trình duyệt dù sao thì không đáng để làm phiền
2. Bởi vì các cách xử lý khác nhau
3. Bạn không thể gọi nó là trình duyệt nếu dù sao hành vi sẽ khác

Đã trả lời ngày 27 tháng 5 năm 2010 lúc 16:37May 27, 2010 at 16:37

KoenkoenKoen

Phim thương hiệu vàng 3.5781 Huy hiệu bạc54 Huy hiệu đồng1 gold badge34 silver badges54 bronze badges

Trường hợp chuyển đổi có nhanh hơn không

Trường hợp chuyển đổi có tốt hơn nếu

Tôi có nên sử dụng các trường hợp chuyển đổi JavaScript không?