:月額1000円、動画の量が豊富なのが魅力。どんなにプログラミングのモチベーションが下がっても戻ってこれるのはドットインストールのおかげ。作る楽しみはここが教えてくれる!
月額料金980円オブジェクト、クラス、メソッド等基本的なことを学べる。おそらく多くのエンジニア志望者はこれから始めると思われる。
:月額1078円とても詳しく説明してくれるがJavascriptを学ぶ講座は少ない。ドットインストール、Progateに続いてやっていいサイトだと思う。
■□━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━□■          SEO対策からビジネス相談まで!500円から買えるココナラ      ■□━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━□■ テレビや新聞、雑誌で注目のココナラ! SEO対策、ビジネス相談、キャリア相談など、登録料は無料で、全て500円~で お願いできる! 価格満足度97%、まだ知らないあなたは損しているかも? あらゆるお困りごとはココナラにお任せ!  https://px.a8.net/svt/ejp?a8mat=3BM75I+4KBQ22+2PEO+OAWWZ  

あなたのスキマ埋めます!padStart()を学んだ 

あなたのスキマ埋めます!padStart()を学んだ 

どうもお久しぶりです。執筆活動があまりに忙しくてBlogの更新が止まってしまいました申し訳ございません。少し時間ができたので、カレンダー作りの続きをやることにしました。それにしても結構学ぶことが多くてびっくりします。いや、自分の勉強がだいぶ不足しているだけなのでしょうが。ココナラ も勉強用に早くもっと使いたいのですが忙しくてできてない。

 

今週のお題「わたしのアウトプット方法」

今週はどうもタグ付けでキャンペーンをはてなブログ主催でやっているようです。詳しくは下記の通り。

blog.hatenablog.com

私のアウトプット方法はもう皆さん知って通り下記のパターンでやっています。

①ブログを書く。私は実は昔のブログと合わせると10年以上ブログを書き続けているヘビーユーザーですからね。ブログでのアウトプットが最も多いですね。

②cyberjaya.xyzを利用してアウトプットをする。もはやデザイン性ゼロのあのブログもプログラミング技術を試すという意味では非常に役に立ちますね。

マインドマップを利用する。
実はここ最近マインドマップをはじめてみました。優秀な方はよくやられているようなので私も真似をしてみることにしました。ちなみに利用しているマインドマップアプリは以下の通りです。

play.google.com

マインドマップスマホアプリが一番かと思いますね。
指で操作するのでデザインもやりやすいかと。

 

本日のコンテンツ
〇前の桁数を埋めるpadStart()について
〇後ろの桁数を埋めるpadStart()について

■前の桁数を埋めるpadStart()について
どっかで学んだかもしれないけど知らないメソッドだからまとめてみた。

どこで利用されているのかというと、例えば2桁とか、3桁までは必ず表したい時などに使用される。例えば、1の場合一桁しか数字がないから「1」にしかならないけど「001」とすれば3桁になる。
こういう時はpadStart()というメソッドを使えばよい。

ちなみに、caniuse.comによるとIEは非対応らしい。

caniuse.com

使い方は以下の通り。

 

変数 = String.padStart(したい桁数,埋める文字);

詳しくは下記のcodepenで実際に動かしてみてほしい。

See the Pen padStart() by tsuyunaruhito (@tsuyunaruhito) on CodePen.

では下記のように簡単にコードの解説をしたい。

  document.getElementById("padStart1").addEventListener("click"function() {
    let pad = "1".padStart(1"0"); 
    document.getElementById("demo").innerHTML 
  = "変数 = String.padStart(1桁にしたい,前から埋める文字列);";
    document.getElementById("demo1").innerHTML = pad});

 

変数padにHTMLのPタグをクリックを押した後に変更するコードとなっています。

変数padには"1"という文字が含まれており、padStartの引数の中には望みの桁数と、埋める文字列が入っています。padStartと書いているくらいなので前から望みの桁数まで引数の文字列で埋めていきます。

最初のボタンでは引数の中は(1,"0")となっているので、望みの桁数は1桁で、それまで0で埋めていくのですが、最初から1桁しかないのでそのまま1が出てきます。

2つ目のボタンでは(2,"0")となっているので、桁数は2桁となります。

XX=2桁

そのうち、一桁目は"0"で埋めるので”0”が来ます。

0X

後は普通に1が来ます。

01

3つ目は3桁にしたくて00で埋めて、最後に1が来ています。

■後ろの桁数を埋めるpadEnd()について

PadStartがあるんだ、Endもあるんだろ?って勘のいい読者の方は中に入るかもしれません。

ちなみに私は思いもしなかったです。あります。

  document.getElementById("padEnd1").addEventListener("click"function() {
    let pad3 = "1".padEnd(1"0"); 
    document.getElementById("demo2").innerHTML 
  = "変数 = String.padEnd(1桁にしたい,後ろから埋める文字);";
    document.getElementById("demo3").innerHTML = pad3});

さっきのpadStartとは違い、したい桁数まで後ろから埋めていきます。

下にあるボタンを押していけば実際に動かせます。

是非お試しあれ。

 

終わりに

今回は簡単にpadStart()とpadEnd()というメソッドの解説をしましたがいかがでしたでしょうか。カレンダーの1月から9月まではpadStartを使い0で埋めいくのにドットインストールでは使ってましたよ。padEnd()の使い道はまだ知らないので、分かったらその都度ご報告します。 

 

他にも細かなJavaScriptの勉強をされたい方は是非下記のページよりココナラ へ登録していただき、エンジニアの方をお探しください。あなたの学びたい望みをかなえてくれるはずです。

 

最近の私の記事は下記の通りです。

interier.hatenablog.com

interier.hatenablog.com

interier.hatenablog.com

 

 

#######################

ツイッターようやく1050人越え。なんか妙に増えたなかった。それもそのはず、最近インスタグラムのほうを頑張り始めたからだ!

↓↓↓↓↓

 

  

読者登録をしていただけると大変助かります。

 
 本サイトが参考になったらクリックをお願いします。


人気ブログランキング