【JavaScript入門 #5】変数を理解しよう！var, let, constの使い分けまで解説！【ヤフー出身エンジニアの初心者向けプログラミング講座】

[@shimabu_it]

今後もプログラミング講座がんばって出していきます！ 要望・質問・人生相談・応援コメント、ぜひぜひお願いします！😆

[@僕はアスペクト]

◎JavaScript変数 ・JSB → ビュワー ・変数とは？ ・データを保存しておくための箱

[@僕はアスペクト]

● 変数 ・ドキュメントに対して要素の幅を取得 　したものを変数に入れたい *const で変数宣言ができる 例) const foo= document.getElement.ID("foo") .offsetwidth ・const foowidth = foo.offsetwidth ・const foo height = foo.offsetwidth

[@僕はアスペクト]

●変数宣言とルール ・変数宣言文 const/let/var 変数名 = 初期値; *const 変数の再代入、再定義ができない *let 再代入できる、再定義できない *var 再代入できる、再定義ができる

[@マコチャン-c5h]

ありがとうございます。分かりやすくて、楽しく学べました。感謝してます。💐💖❣🌈🌟✨

[@tukinozyuuninn]

わかりやすかったーｂｂ

[@てつぺい-n6o]

本当にわかりやすいです。ありがとうございます。

[@はむ-l8o]

本当に助かります。正直エンジニア合ってなくて辞めようかと思ってました。今一年目です。

[@ken2470]

素晴らしい動画ありがとうございます😊😭これからも頑張ってください。

[@gorikidasan]

説明がわかりやすいです。

[@Sou_mamodan]

ありがとます

[@iimurakazuo]

04:50 変数の使い方を初めて理解した瞬間でした。ありがとうございます。

[@白猫-y9j]

constは定数なのではないでしょうか

[@白猫-y9j]

8:40　のコメントの中は全部変数になっているが、constは定数ではないのだろうか

[@奥山拓郎-o7f]

いつもありがとうございます。楽しく学ばせていただいています

[@user-jt7zf8ld9q]

とてもわかりやすいです。他の動画も楽しみです。知りたいことが繋がってきました。ありがとうございます。

[@chain8984]

プログラミングを使わない職場なのですが、勉強のために拝見させていただいています！ プログラミングとは関係ない質問なのですが、8:50の操作はどうやってやっているんですか？ショートカットキーが割り振られていますか？

[@shanshanli05]

初心者でいつもvarしか使ってなかったです。動画を見て使い分け方がよくわかりました。ありがとうございます。

[@YAYOI9999]

JavaScriptを触ることが多いので、せめて読み方だけでも判るように勉強はじめました。初学者ですが、めっちゃわかりやすいです

[@eeeg]

js binいいなと思ったけど、エミット出ないんだね😭

[@eeeg]

var使ったら負け…var使ったら負け… let使いは甘え…let使いは甘え…

[@bbaaa3748]

とても分かりやすかったです！ JavaScriptに対する苦手意識が薄れてきました！ 本当にありがとうございます！

[@shimabu_it]

おそらく#9までいくと、かなり今までの話がつながるかと思います。関数が難しいですが、1度に理解できなかったとしてもとりあえず#9まで見て頂けると嬉しいです！「ああ、そういう使い方をするのね」となるかと思いますので😊

[@shimabu_it]

お礼を言うの忘れていました！ こちらこそコメントありがとうございます✨

[@大雅-z7f]

しまぶーさんはどうやってプログラミングを学習したんですか？

[@supereiji]

なぜvarがあるのかの説明がよかったです。 特に知る必要もないかも知れなけど、こういう情報は大切です。

[@shimabu_it]

そう言ってくださって嬉しいです。 今後の講座でもこういう豆知識を出していけるときは出しますね！✨

[@MisatoHoshina]

料理に例えるのめちゃくちゃわかりやすいです。神です。

[@marick1574]

オンラインスクールのカリキュラムに合わせて視聴してます✨とても分かりやすく、参考になります!!!!!✨

[@ぽめらにあん-i9b]

JSの入門書を読んでもconst、let、varの違いがイマイチ理解できませんでしたが、しまぶーさんの動画のおかげで違いがよくわかりました！良質な動画をいつもありがとうございます😊

[@takuzo703]

constの特徴、const, let, varの使い分けの説明のところがとても有意義でした。ハイクオリティな講座に感謝です！Reactの講座まで待ち遠しいです。

[@shimabu_it]

ありがとうございます。 React講座も必ずやるのでお待ち下さいー！！😂

[@ワッショイ-n5t]

毎回すごくわかりやすくて、初学者の私にはとってもありがたいです！！ 喩えが分かり易いですし、テンポもよくて最高に見やすいです！！ いつもありがとうございます！！

[@shinjikawadu742]

progateで、ES6とES5があって、jqueryを学ぶときにletでも動くのになぜ、varでないとクリア認証してくれないのかモヤモヤしてましたが、昔はvarしかなかったと知ってスッキリしました！！

[@平野裕大-o7o]

毎回本当にわかりやすい解説ありがとうございます！！！

[@caffaddict]

再定義と再代入の違いがいまいちわからない 中身が変わるって意味では同じな感じがする

[@瀧田佳一郎]

代入と再定義の意味が あんまり理解できなかったんですけど 今回の動画で、完璧に理解できました✨

[@koko-sd7kx]

他のサイトや動画を見ましたが1番分かりやすかったです！ありがとうございました✨

[@samrai352]

今回もお疲れ様です！ いつも初学者に優しい内容ありがとうございます😊

[@casettejp]

const って確かC言語だったのでは?と思ったら、JavaScriptにも実装されたという事なのですね。時代は変わったと痛感しています。

[@ddf-ks3lf]

内容は素晴らしい、ただBGMが邪魔というか気が散る。

[@ウタくん-x4q]

ドットインストールにてJSの基礎終え、 謎が多かったのですが しまぶーさんの動画と併用したらすんごい理解が深まいました💪 ありがとうございます！ 次の動画も見てきます😚

[@sua43]

こんなに簡単に理解できるんですね……。 この動画にたどり着いて良かったです😂

[@ulu7113]

動画アップお疲れ様です！！ js講座の4.5を一気に拝見させて頂きました。 今までドットインストールとしまぶーさんの講座で学習していたのですが、この4.5回の講座で点と点が繋がった感覚になりました！😳 本当にわかりやすいです😭 これからもあなたに近づけるように頑張ります！

[@shimabu_it]

私に近づくどころか追い越してしまってください！(^O^)笑 今後もっと繋がるポイントも出てきますので、期待していてくださいね！

[@kaname8155]

プロゲートで学習したのですが、再認識出来ました！ありがとうございました！

[@ww-zo2yl]

キャメルとスネーク、印象に残りました🐍🐫こうゆう解説もありがたいです。

[@syaka4274]

js binで動画通りに入力すると、現在はES6がうんたらかんたらと、Runエラーが出ますね。 内容は素晴らしかっただけに、プログラミングにおける世代進化の残酷さを知ってしまった・・・。

[@jr.1353]

: と ; を間違えてよくエラー出るんですよねぇ。

[@kowich6789]

勉強になりました。プラスαの知識が他の動画より分かりやすいです。それが価値だと思っています。次回が楽しみです。初心者には凄く分かりやすいです。

[@shimabu_it]

プラスαの知識、なるほど・・・私の中で当たり前になって、説明しきれていない部分もまだあるかと思うので今後も気をつけながら、なるべく色んな知識を紹介できるように作っていきますね😊 学びコメントありがとうございます！

[@satoshi_n61]

varは最近使われなくなったというのを聞いたことがありましたが、そんな背景があったんですね！ わかりやすい動画ありがとうございます。 関数のレッスンやってもらいたいです！

[@shimabu_it]

varはもう自分で書くことはないですねー。私の知る限りでは使う用途はないです。そして実は次が関数を予定していたりします。少なくともあと数回以内で出せるはず😁

[@近藤裕二-o7q]

す、すばらしい！

[@daisukeexperience4507]

あまりよくわからずconstを使ってました。 varを使ったら負け、素晴らしい言葉です。

[@tdzophga]

めっちゃ分かりやすかったです！ オンライン のスクール受講してるんですけど、ここまで詳しく教えてくれないです😁

[@2214124]

既に学習した内容ですが、使い分け方が分かってなかったので見て良かったです。 'varを使ったら負け' 覚えやすい！

[@styx9305]

ConstはJavaで言うところのprivateでしょうか？不変って事ですよね？変えたいときは新たに変数を作るということですか？

[@人面アライグマ]

今回も勉強になりました‼️ 独学で勉強してるので、わかりやすい解説&プラスαの知識を教えていただき助かります‼️次回の動画も楽しみにしてます✨

[@ディーちゃんロハンくん]

毎回楽しみです！ 過去動画から順に見てるので、古い動画へのコメントが多くなります💦 最新動画に追いつき、かつ、きちんと吸収できるように過去動画も繰り返し何度も見させて頂きますね。

[@おかだ-d9b]

わかりやすく最高な講義、本当にありがとうございます。 一点質問なのですが、現在Node.jsを使ってtypescriptでサーバ側の処理を書いています。そこでconsole.log()が使用できます。しかし、ブラウザのwindowオブジェクトにアクセスしないと使えないんじゃないのか…？と思ったのですが Node.jsが準備してくれてるんですかね？

[@shimabu_it]

質問ありがとうございます！ 解答しますと、JavaScriptは実行環境によってグローバルオブジェクトが違っていて、ブラウザの場合はwindowオブジェクトで、Node.jsの場合はglobalオブジェクトになります。 globalオブジェクト参考 nodejs.org/docs/latest-v12.x/api/globals.html window, globalで同名でほぼ同じ機能をもつプロパティやメソッドもあって、consoleはその1つになります。なのでNode環境でも使えるということですね。 ちなみにdocumentはwindow固有だったり、processはglobal固有だったりと、それぞれでしかアクセスできないものも当然あります。 ...という感じで少し難しいのですが、ご理解いただけたでしょうか。また分からなければ教えて下さい。😊

[@おかだ-d9b]

なるほどです！めちゃ、わかりました！ありがとうございます。 しまぶーさんの動画、楽しみにしています。今後もがんばってください！

[@hirokiminaga7450]

いつも本当にわかりやすく解説していただきありがとうございます。 今JSを勉強しているのですが、その際Jqueryも学習したほうがよろしいですか？

[@shimabu_it]

私はjQueryは必要ないと考えている派です。 それも近いうちに動画に出して解説します。

[@でべそ太郎]

とてもわかりやすくて助かります。ありがとうございます！ しまぶーさんはよく"foo"という単語を使ってご説明されていますがこれは”hogehoge”のような「適当に名前つけたい時に使う単語」として業界でもよく出てくる単語なのでしょうか？それともしまぶーさんがよく使うというだけで業界的にはあまり用いない単語でしょうか？ 本筋コンテンツに対する疑問ではないですが、純粋に興味を持ったのでお伺いしてみました！

[@こっつん-h3v]

しまぶーさんの内容は、最新の情報なのですごく良いですよね！ 自分は varが普通と思ってたので、「使ったら負け」は衝撃でした😱 各用語の説明だけでなく、使い分けまで説明して頂いているので すごく助かります。 これからも頼りにしてますので是非頑張って続けて頂きたいと思います。🤗

[@waltzxp]

わかりやすいどうがをありがとうございます！ 動画と関係ない質問になってしまい，申し訳ないのですが，よくweb系アプリの求人で開発経験が必須となっているのですが，この開発経験とはどのレベルを指すのでしょうか？ どうしても知りたかったもので… お願いします！

[@shimabu_it]

ありがとうございます！少し回答が遅れてしまってごめんなさい😭 開発経験はめちゃくちゃ企業に、そして応募中の職種によりますね。かなり書いてあることが違うので一概には言えません。 例えばヤフーのデータベースエンジニア↓↓↓ ・Java、Python、Goのいずれかを利用したソフトウエアの開発、運用経験 ・データベースの運用経験、またはデータベーススペシャリストの資格 ・データベースの状況監視や最適なパフォーマンスチューニングの経験 LINEのサーバーサイドエンジニア↓↓↓ ・Webアプリケーション開発経験　 3年以上（言語：Java/Kotlin/Node.js/Perl/Python/Ruby/PHP/Scala等） ・コンピュータサイエンスの基礎知識（アルゴリズム、データ構造、データベース、ネットワーク等） ・チームでのソフトウェア開発経験 ・RDBMSを利用した開発経験 メルカリのサーバーサイドエンジニア↓↓↓ ・メルカリのミッションとバリューへの強い共感 ・大規模サービスの負荷を考慮したバックエンドの設計・開発・運用スキル ・ユニットテスト、機能テスト、E2Eテストを含むソフトウェアテストに関する知識と開発経験 ・Database(RDBMS,NoSQL)を効率的に利用するためのデータモデル設計/データ問い合わせの知識と経験 ・クラウドにおける開発経験（特にGCP、もしくはAWS） ・Git / GitHubもしくは類似のバージョン管理システムを利用したチームでの開発経験 ...という感じでフワっとしているところもあれば、カチッとしているところもある、というので判断が難しいんですね。どのレベルだから、という明確なラインはないので、自分がいけると思ったタイミングで申し込むしかないですね！

[@waltzxp]

しまぶーのIT大学 こんなに詳しく… お忙しい中，ありがとうございます！

[@shimabu_it]

@@waltzxp コメントガチ勢です(^O^)

[@ごろごろごろ-f1r]

コメント失礼します。最近見始めました！ ＪSビーンの動かし方についてもう少ししりたいです。

[@eimusic6860]

これは目からうろこ。 めっちゃわかりやすいです。

[@shimabu_it]

🐟👀

[@IMikeMurakami]

いつもありがとうございます！とても分かりやすかったです。プログラミングに全然関係ありませんが、２番目の曲好きです。😁

[@shimabu_it]

奥さんが選曲・編集していますが、喜んでいました🤣

[@田中武-x6e]

const＝定数、let＝変数だと覚えていました。 表にして解説いただけると、凄く自分の中で腑に落ちました！ まだ使い方はピンと来ませんが、大事な要点かと思いますので、少しずつ理解していきます。ありがとうございます(^^)

[@shimabu_it]

定数と変数っていうだけでなく、技術的にどう違うかを理解するとおもしろいですよね。腑に落ちたようで良かったです！！ 学ぶことはおもしろいですよねー😋

[@tmt3917]

お料理好きなのですか？

[@shimabu_it]

例えで便利だっただけです〜！笑

[@goneits1359]

varをあんなに断言してもらえると本当に助かります。。。。。。。。 本当にわかりやすい！！

[@twggnpho23]

varを書く人間は負け組・・・覚えておきます。

[@たなちゃん健ちゃん]

ぬおお～！難しくなってきたぞ、言語がC言語なのかアセンブラなのか？はたまたフォートランなのか、悩ましい。 でも、何か楽しい。

[@GASSY-hr4xk]

JavaScriptの変数苦手意識あったのですが、相変わらずすごくわかりやすかったです！ 私はかなり適当にvarばっかり使ってしまってました＾＾； 知らぬうちに負けまくってました。 これからは、意識してconst一本で頑張ります！

[@shimabu_it]

> 知らぬうちに負けまくってました。 笑 constだけだとできないのも出てくると思うので、letまではOKですよ！ 👍

[@陳嘉翔-y5w]

いつも多様な教え方を試みる姿勢は尊敬しています！数学専門だったので、変数はすでに慣れたかもしてないが、変数を箱やキッチンの物に例える説明は初めて聞きました（笑） 学校の授業は無理やりプログラミングの変数の概念を飛ばした気がして、たくさんのことは初耳です！ 変数の概念でも丁寧に教えていただいて感動します！これからも応援を続けます（^ω^）

[@shimabu_it]

いつもコメントありがとうございます！ 物事をなにかに例えるのが好きです🤣笑 変数はしっかり抑えておくべき内容なので動画にしました！これからもっと難しい内容も入ってきますが、なるべく分かりやすく解説できるようにがんばります。もしかしたら、また変なので例えるかもしれません(^O^)

[@cloclo9379]

変数は冷蔵庫

[@秋月春花-s3x]

WEBデザイナーのお仕事をしています。まだまだ歴が浅く、JavaScriptは一度挫折しました＞＜ 今後どうしても必要となってくるので、苦手意識大ですがなんとかものにしたいと思っています！ そんな時にありがたいyoutubeに出会えました＾＾ 無料でこれだけわかりやすく解説してもらえる＆しまぶーさんがイケメンなので本当にありがたいです！笑

[@mfs__mi22]

オブジェクトの中身が変更できるのに定数で定義できるのがずっと意味わからなかったからすごい自分得の動画でした！

[@はる-m8z3o]

const、let、var

[@redwhale6023]

JavaScriptには、変数と定数を宣言するキーワードとして、'var'、'let'と'const'の三つがありますが、Google、Twitter、Yahooなどの大きなサイトでは、JavaScriptの宣言キーワードは全部'var'です。新しいキーワードの'let'と'const'は全く使われていません。 これはなぜですか？

[@shimabu_it]

理由は2つあって、1つはサイト自体がlet, constの登場依然からあり(2015年頃からlet, constは使われ始めた)、該当コード部分がアップデートされていないからです。 もう1つが難しい話になるのですが、letやconstがトランスパイラで変換されてvarになっているからです。こちらの方が理由としては可能性が高いです。正直、テキストで分かりやすく伝えるのには限界があるのですが、一応説明いたします。現代のJavaScriptにおいては、我々エンジニアが書いたコードは、ブラウザ対応や依存解決の観点から、変換して使われるのが当たり前になっています。例えば、TypeScript、React、Vue、ES2015以降の記法などは、生JavaScriptに変換されて使われます。その変換時に、letやconstがvarに変わるというわけですね。 難しいかと思いますが今後のJavaScript講座で必ず触れる内容です。ReactやTypeScriptに入る前に必ず動画にします。今は理解できなくても問題ありませんので、とりあえず書いてるコードと実際に動くコードが違うことだけ認識していただけるとOKです。 ちなみに現状はletもconstも変換は要らず、ほぼ問題なく使えます。 let 対応ブラウザ developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/let#Browser_compatibility const 対応ブラウザ developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/const#Browser_compatibility

[@redwhale6023]

@@shimabu_it 勉強になりました！ありがとうございます