Jump to content
chaot1x

[JS] Binārais pulkstenis

Recommended Posts

Mācību nolūkos, lai izprastu labāk javascript oop, izveidoju bināro pulksteni.
Tiem kas nezin kas ir binārais pulkstenis, šajā rakstā tas ir ļoti labi aprakstīts, kas tas ir un kā viņu lasīt - http://www.wikihow.com/Read-a-Binary-Clock

Github repo - https://github.com/chaot1x/binary-clock

Izskatās apmēram šādi:
1SXaccw.png

P.S. Gaidu sliedes dirsienus ka viss ir slikti :D, bet ja nopietni būtu pateicīgs ja kāds ieteiktu kā un ko darīt labāk.

  • Upvote 6
  • Downvote 1

Share this post


Link to post
Share on other sites

Html elementus vajag veidot, kā atsevišķas komponentes un pieglabāt references, lai pēc tam kodā nav html elements jāmeklē ar getElementsByClassName. Nebūs jātaisa arī šādi nelasāmi gabali 

return '<div class="seconds-row">' +
            '<div class="s1">' +
            this.clockTicks(3) +
            '</div>' +
            '<div class="s2">' +
            this.clockTicks(4) +
            '</div>' +
            '</div>';

index.html tu jau nodefinēji var clock, tad iekš js viņu nevajag vēl pie window objekta likt klāt  window.BinaryClock = BinaryClock;

Edited by LoyC
  • Upvote 2

Share this post


Link to post
Share on other sites

Pirmo reizi ko tādu redzu, bet diezgan labs. Tikai īsti nesaprotu, tas 7 nav pareizs tur, vai tikai man tā izskatās. Nu runājot par bildi. Jo rindas taču ir 1;2;4;8. Būtu jādeg pirmajiem 3, bet tev deg 2 un 3. Vai tikai es kaut ko ne tā sapratu?

Share this post


Link to post
Share on other sites

1 = 01

3 = 0011

1 = 001

9 = 1001

2 = 010

7 = 0111, deg tur 0110 kas ir 6 tāpēc, ka uzņemot screen, sekudes varbūt ātrāk nomainījās, bet binārais palika vēl tāds pats.

  • Upvote 1

Share this post


Link to post
Share on other sites
1 hour ago, inadatequate said:

Pirmo reizi ko tādu redzu, bet diezgan labs. Tikai īsti nesaprotu, tas 7 nav pareizs tur, vai tikai man tā izskatās. Nu runājot par bildi. Jo rindas taču ir 1;2;4;8. Būtu jādeg pirmajiem 3, bet tev deg 2 un 3. Vai tikai es kaut ko ne tā sapratu?

Nu uz 6 deg 2 un 4, screena laikā 1 nepaspēja iedegties, jo ir neliela animācija

Share this post


Link to post
Share on other sites

Ja taisi pulksteni, tad kāds sakars tur datumam un visādiem tulkojumiem? Vai nu nahrenizē, vai atdali loģikas.
Kā jau te minēja, netaisi templates ar javascript, tā vietā vnk nomaini content jau esošam. Un pēc tam uz init uzseto globālas references.
Īsti nesaprotu  splitToArray principu.

Share this post


Link to post
Share on other sites

#1

Array.prototype.forEach.call(string.split('.'), function(key) {
  if (typeof array !== "undefined") {
  	array = array[key];
  }
});

Kāpēc tu te taisi kaut kādu pornogrāfiju, ja tu vari vienkārši saukt forEach metodi uzreiz uz masīva, ko atgriež string.split('.')?

string.split('.').forEach(function(key) {
  if (typeof array !== "undefined") {
  	array = array[key];
  }
});

#2

Funkcijā __ tu divreiz izsauc this.splitToArray. Manuprāt, labāks variants tur būtu sataisīt, lai izsaucot to funkciju, tev atgriež masīvu ar visiem elementiem (aka str.split vienkārši) un tad norādītajai un defaultajai valodai izloopo cauri. Pie tam pie if (typeof translation === "undefined") { vajadzētu arī nočekot, vai fallback valoda nav tā pati, kas norādītā, jo savādāk useless vēlreiz loopot.

#3

BinaryClock.prototype.sprintf = function () {
  if (arguments.length >= 2) {
    var string = arguments[0].toString(),
        type = typeof arguments[1],
        args = (type === "string" || type === "number") ?
        Array.prototype.slice.call(arguments[1])
    : arguments[1];

    for (var key in args) {
      if (args.hasOwnProperty(key)) {
        string = string.replace(new RegExp("\\%" + key + "\\%", "gi"), args[key]);
      }
    }

    return string;
  }
};

vs

BinaryClock.prototype.sprintf = function () {
  if (arguments.length < 2) {
    return; 
  }
  var string = arguments[0].toString(),
      type = typeof arguments[1],
      args = (type === "string" || type === "number") ? arguments[1].slice() : arguments[1];

  for (var key in args) {
    if (args.hasOwnProperty(key)) {
      string = string.replace(new RegExp("\\%" + key + "\\%", "gi"), args[key]);
    }
  }

  return string;
};

Kas tur ir mainījies:

  • Netaisam gigantiskus scope (šajā gadījumā if)
  • Ja izmanto īso if pierakstu, neliec katru daļu savā rindā. Maksimāli nepārskatāmi.
  • Iemācies izmantot array funkcijas (es gan tā arī nesapratu jēgu no tava īsā if)

#4

Neraksti HTML Javascriptā. Izmanto document.createElement un pēc tam references.

 

  • Upvote 3

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.