Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
クイズJavaScript王決定戦
Search
coboco
November 28, 2018
Technology
0
520
クイズJavaScript王決定戦
HTML5 4th Anniversary@GMO
秋のJavaScript祭@富士通クラウドテクノロジーズ
Monaca UG TOKYO #7 〜忘年LT大会〜@アシアル
で使ったスライドです。
coboco
November 28, 2018
Tweet
Share
More Decks by coboco
See All by coboco
ペットのにおい検知IoT
coboco
0
670
技術書の原稿はWordで書いちゃダメゼッタイという話
coboco
6
240
Other Decks in Technology
See All in Technology
Luupの開発組織におけるインシデントマネジメントの変遷 ver.RoadtoSRENEXT2024
grimoh
1
270
Datadog Cloud SIEMを使ってAWS環境の脅威を可視化した話/lifeistech-datadog-cloud-siem
gidajun
0
480
AutomatedLabを使って内部ペンテストを勉強しよう! -やられ社内ネットワークの自動構築-
n_etupirka
1
610
LINE WORKSへ簡単通知!Incoming Webhookアプリの紹介
mmclsntr
0
110
クラウド利用者の「責任」をどう果たす?AWSセキュリティ対策のススメ #AWSSummit
hiashisan
0
270
簡単に始めるSnowflakeの機械学習
nayuts
1
190
20240725 LLMによるDXのビジョンと、今何からやるべきか @Azure OpenAI Service Dev Day
nrryuya
3
1.2k
地理情報とAPIのトレンド
nagix
0
160
ソフトウェアエンジニアリングの知見を活かして データ基盤をいい感じにする on Snowflake [MIERUNE BBQ #10]
mtpooh
2
150
[NIKKEI Tech Talk] KDDI/KAG Scrum & Community for Engineering Training
curanosuke
2
220
エンジニアの生存戦略 〜クラウド潮流の経験から紐解く技術トレンドのメカニズムと乗りこなし方〜
shimy
9
1.9k
ABEMAにおけるLLMを用いたコンテンツベース推薦システム導入と効果検証
cyberagentdevelopers
PRO
1
720
Featured
See All Featured
StorybookのUI Testing Handbookを読んだ
zakiyama
15
4.9k
The Invisible Side of Design
smashingmag
294
50k
Unsuck your backbone
ammeep
666
57k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
129
32k
Learning to Love Humans: Emotional Interface Design
aarron
269
39k
Web Components: a chance to create the future
zenorocha
307
41k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
502
140k
Fantastic passwords and where to find them - at NoRuKo
philnash
42
2.7k
WebSockets: Embracing the real-time Web
robhawkes
59
7.2k
Git: the NoSQL Database
bkeepers
PRO
423
64k
Fontdeck: Realign not Redesign
paulrobertlloyd
79
5.1k
Code Reviewing Like a Champion
maltzj
517
39k
Transcript
URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
1 JavaScript 決定戦 クイズ 王
第1問 2 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All
Right Reserved.
◼ 以下の実行結果は?(A or B) 3 問題 let x = "0";
if(x) { console.log("A"); } else { console.log("B"); } 3 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
◼ 条件式における値の評価 • 論理値以外の値を条件式として指定すると、以下のように判定される 条件式の論理値判定 true false 0以外の数値 1文字以上の文字列 オブジェクト(中身が空でも)
0 空文字("") undefined null 4 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
◼ データ型一覧 5 JavaScriptのデータ型は2種類に分類できる 型の分類 代表的な型 プリミティブ型 (1つの値のみを持つ) 数値、文字列、論理値 null(値が存在しない)
undefined(値が定義されていない) オブジェクト型 (データの集合体) オブジェクト、関数、配列など 5 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
6 オブジェクトの基本 ◼ プロパティとメソッド • オブジェクトは、複数のデータの集合体である • オブジェクト内のデータには、オブジェクトの属性値を保持する「プロ パティ」と、何らかの操作を行う「メソッド」がある オブジェクト
プロパティ メソッド 6 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
7 オブジェクトの種類 ◼ Objectオブジェクトはすべてのオブジェクトのベース Object String (文字列) Array (配列) Function
(関数) ・toString() ・valueOf() ・hasOwnProperty() … 7 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
第2問 8 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All
Right Reserved.
◼ 以下の実行結果は?(true or false) 9 問題 let a = "hoge";
let b = new String("hoge"); console.log(a == b); 9 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
10 プリミティブ型の文字列 ◼文字列リテラルは、以下の二種類 • シングルクォート・ダブルクォートのどちらでも可 'hoge' "hoge" 10 URL :
https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
11 オブジェクトの生成 ◼ オブジェクトの生成方法 • Objectオブジェクトの生成は、オブジェクトリテラル{}で代用することが可能 • Arrayブジェクトの生成は、配列リテラル[]で代用することが可能 ◼オブジェクト生成の例 var
変数名 = new オブジェクトの型名(引数); var list = new Array(1,2,3); 11 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
12 JavaScriptの文字列は2種類 ◼文字列にはプリミティブ型とオブジェクト型の二種類がある • 文字列リテラルはプリミティブ型となる let a = "hoge"; //
プリミティブ型 let b = new String("hoge"); // オブジェクト型 12 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
プリミティブ型とラッパーオブジェクト プリミティブ型(文字列) "hoge" オブジェクト型(String) ・length ・replace() ・substr() "hoge" … ◼
プリミティブ型は1つの値だけ、オブジェクト型は複数のメソッド やプロパティを持つ 13 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
◼ JavaScriptの等価演算子には二種類ある 14 等価演算子 演算子 説明 例 結果 == 緩やかな等価演算子
5 == '5' true === 厳密な等価演算子 5 === '5' false != 緩やかな不等価演算子 5 != '5' false !== 厳密な不等価演算子 5 !== '5' true 14 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
第3問 15 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All
Right Reserved.
◼ 以下の実行結果は?(true or false) 16 問題 let a = new
String("hoge"); let b = new String("hoge"); console.log(a === b); 16 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
17 オブジェクト生成の仕組み ◼ オブジェクト生成時の流れ ① オブジェクトの生成時に、コンストラクタという関数が実行される ② コンストラクタは、新しくオブジェクトを生成し、それを戻り値として 返却する(このオブジェクトをインスタンスと呼ぶ) var
list = new Array(1,2,3); list Arrayのコンストラクタ インスタンス 17 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
◼ プリミティブ型は値そのものを比較する ◼ オブジェクト型は参照しているオブジェクトが同じかどうかを 比較する 18 値の比較、参照の比較 a b "hoge"
"hoge" 18 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
19 同じオブジェクトを参照している例 a b "hoge" "hoge" let a = new
String("hoge"); let b = a; console.log(a == b); この場合は同じオブジェクトを 参照しているのでtrue 19 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
第4問 20 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All
Right Reserved.
◼ 以下の実行結果は? 21 問題 console.log("hoge".length); A) 4 B) null C)
undefined D) エラー 21 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
◼ プロパティを呼び出した場合、プリミティブ値から対応する ラッパーオブジェクトへの暗黙的な変換が行われる ラッパーオブジェクトへの暗黙的変換 "hoge".length "hoge" ・length ・replace() ・substr() "hoge"
… プリミティブ型 ラッパーオブジェクト 変換 22 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
第5問 23 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All
Right Reserved.
◼ 以下の実行結果は? 24 問題 let array = [10, 20, 30];
array[9] = 99; console.log(array.length); A) 3 B) 4 C) 9 D) 10 24 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
25 配列のインデックス 0 1 2 10 20 30 9 99
◼ インデックスは連番でなくても割り振ることができる ◼ lengthプロパティは最大インデックス+1を返す 25 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All Right Reserved.
何問正解しましたか? 26 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All
Right Reserved.
温泉の素(ニューヨク剤)をプレゼント!! 27 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All
Right Reserved.
温泉といえば・・・? コミッター募集中! 28 URL : https://ja.monaca.io/ Copyright © Asial Corporation.
All Right Reserved. https://ja.onsen.io/
ありがとうございました! 29 URL : https://ja.monaca.io/ Copyright © Asial Corporation. All
Right Reserved.