JavaScriptåºç¤ææ³æéãã¹ã¿ã¼
ç¶ã
ã¨å¢ãç¶ããåºç¤ææ³æéãã¹ã¿ã¼ã·ãªã¼ãº(ãã¾ãã«ãå¢ãã¦ããã®ã§ä»ã®è¨èªè¨äºã¸ã®ãªã³ã¯ã¯別の記事ã«ç§»ãã¾ãã)ã
JavaScript çã¯èª°ãæ¸ãã¦ããªãã£ããããªã®ã§æ¸ãã¦ã¿ã¾ãããããã解説è¨äºçãªãã®ãæ¸ãã®ã¯åãã¦ãªã®ã§å¤ãªã¨ããããã£ããææãã¦é ããã¨ãããããã§ãã
JavaScriptã®åºç¤æ¦å¿µã«ã¤ãã¦ã®è§£èª¬ã¯ãã¡ãï¼JavaScript基本概念最速マスター - TechTalkManiacs
- 1/31 23:58追è¨
- ã³ã¡ã³ãæ¬ã®os0xããã®ãææãåºã«ä¸é¨è¿½è¨ã»ä¿®æ£ãè¡ãã¾ããã
- 2/2 2:52追è¨
- switchæã»æ£è¦è¡¨ç¾ã»ä¾å¤å¦çã«ã¤ãã¦è¿½å ãã¾ããã
- 2/2 6:44追è¨
- ã³ã¡ã³ãã§favrilããã«ãææé ããç¹(typo & ã³ã¡ã³ãã»ãµã³ãã«è¿½å )ãä¿®æ£ã»å çãã¾ããã
- 2/2 7:15追è¨
- ãã©ãã¯ããã¯ã§LiosKããã«ãææé ããç¹(call, apply, ããªããã£ãå¤, strict ã¢ã¼ãã®this) ãä¿®æ£ã»å çãã¾ããã
- 2/2 20:02追è¨
- ã³ã¡ã³ãæ¬ã®os0xããã®ãææãåºã«ï¼call, applyã®ãµã³ãã«ã³ã¼ããä¿®æ£ãã¾ããã
- 2/7 8:23追è¨
- ã³ã¡ã³ãæ¬ã®nanto_viããã®ãææãåºã«ï¼ã¹ããªã¯ãã¢ã¼ãã«é¢ãã注ææ¸ãã追å ï¼ããã³ãµã³ãã«ã³ã¼ãã®ä¿®æ£ãè¡ãã¾ããã
ã¾ããã
æ¬è¨äºã¯ä¸»ã« JavaScript ã®ææ³é¢ã«ã¤ãã¦è§£èª¬ãã¾ããåºæ¬çã« ECMAScript 第3çã®ç¯å²å ã®ææ³ã«ã¤ãã¦åãæ±ãã¾ããï¼ããããã¯ã¿åºãé¨åã«ã¤ãã¦ã¯é©å®æ³¨éãã¤ãã¦ããã¾ãã
JavaScript ã®æ¨æºä»æ§
JavaScript ã®ä»æ§ã¯æ¨æºåå£ä½ Ecma International ã«ãã£ã¦ ECMAScript ã¨ãã¦å®ãããã¦ãã¾ãããã® ECMAScript ãå社ãå®è£ ããã®ã Mozilla çã® JavaScript ã Microsoft ã® JScript, Adobe ã® ActionScript ãªã©ã§ã(詳細ã¯ECMAScript - Wikipediaåç §)ããã åã« JavaScript ã¨è¨ã£ãå ´åã¯ãããã®å®è£ ãã²ã£ãããã¦å¼ãã§ãããã¨ãå¤ãããã§ãã
JavaScript ã®å®è¡ (ãã©ã¦ã¶ç·¨)
JavaScript ã§æ¸ããããå®è¡ããããã«ã¯ãã©ã¦ã¶ãç¨ããã®ãä¸çªæã£åãæ©ãã§ãã1è¡ã§æ¸ãã¹ã¯ãªãããå®è¡ããå ´åï¼ãã©ã¦ã¶ã®ãã±ã¼ã·ã§ã³ãã¼ã«ä»¥ä¸ã®ããã«æã¡è¾¼ã¿ã¾ãã
javascript: å®è¡ãããããã°ã©ã
ä¾ãã°ï¼ã¡ãã»ã¼ã¸ã表示ããããªã以ä¸ã®ããã«ãã¾ãã
javascript: alert("aaa");
ããã¯ãã¼ã¯ã¬ããã¯ãã®ããã«ã㦠JavaScript ããã°ã©ã ãå®è¡ããã¦ãã¾ãã
ä¸è¨ã®ä»çµã¿ã§å®è¡ã§ããã®ã¯1è¡ã«åã¾ã(æ¹è¡ãå«ã¾ãªã) JavaScript ã ãã§ããæ¹è¡ã§ã¯ãªãã»ãã³ãã³ã§æãåºåããã¨ã§è¤æ°ã®æãå«ãããã°ã©ã ãå®è¡ã§ãã¾ããï¼ãã®ãããªããã°ã©ã ã¯èªã¿æ¸ããã¥ãã大å¤ã§ããè¤æ°è¡ã® JavaScript ãå®è¡ãããããã«ã¯ï¼ JavaScript ã®ã½ã¼ã¹ã³ã¼ãã ãã§ã¯ãªã以ä¸ã®ãã㪠HTML ãæ¸ãï¼ããããã©ã¦ã¶ã«èªã¿è¾¼ã¾ããå¿
è¦ãããã¾ãã
<html> <head> <title>JavaScript ãã¹ã</title> <!-- HTMLä¸ã«ç´æ¥ã½ã¼ã¹ã³ã¼ããæ¸ãè¾¼ãå ´å --> <script type="text/javascript"> <!-- // ããã«ã³ã¼ããæ¸ã //--> </script> <!-- å¤é¨ã®ã½ã¼ã¹ã³ã¼ããã¡ã¤ã«ãèªã¿è¾¼ãå ´å --> <script type="text/javascript" src="javascriptã®ãã¡ã¤ã«å"></script> </head> <body> <!-- script è¦ç´ 㯠body å ã«ç½®ãã¦ãOK --> <script type="text/javascript"></script> </body> </html>
JavaScript ã®å®è¡ (ãã©ã¦ã¶ä»¥å¤ç·¨)
ãã©ã¦ã¶ä¸ã® JavaScript ã¨æ¯è¼ããã¨ãã¤ãã¼ã§ããï¼ä»ã®è¨èªã®ããã«ã·ã§ã«ä¸ã§ JavaScript ãå®è¡ã§ããå®è£ ãããã¾ããããã§ã¯è©³ç´°ã«ã¯è§¦ãã¾ããã
åºç¤
printæ
JavaScript ã®æ¨æºã©ã¤ãã©ãªã«ã¯å ¥åºåã«é¢ããé¢æ°ãä¸åå®ç¾©ããã¦ãã¾ããï¼æååãåºåããå ´åã¯ï¼ãã©ã¦ã¶ã§å®è£ ããã¦ãã alert é¢æ°ãç¨ããäºãå¤ãã§ãã
alert("Hello, world");
ã¾ãï¼æè¿ã¯å¤ãã®ãã©ã¦ã¶ã§ console.log ããµãã¼ãããã¦ããã®ã§ï¼ã³ã³ã½ã¼ã«ã¦ã¤ã³ãã¦ã«ã¡ãã»ã¼ã¸ãåºããã¨ãã§ãã¾ã (Firefoxã®å ´åï¼Firebugãã¤ã³ã¹ãã¼ã«ããã¦ãã¦èµ·åãã¦ããªããã°ãªãã¾ãã)ã console.log ã使ãã¨æååã ãã§ãªãæ§ã ãªãªãã¸ã§ã¯ããåºåãããã¨ãã§ãã¾ãã
console.log("Hello, world"); console.log([1, 2, 3]);
ã³ã¡ã³ã
ã³ã¡ã³ã㯠C ç³»ã®è¨èªã¨åãã§ãã
// ä¸è¡ã®ã³ã¡ã³ã /* è¤æ°è¡ã® ã³ã¡ã³ã */
ææ³ãã§ãã¯
次ä¸ä»£ãã¼ã¸ã§ã³ã® JavaScript (ECMAScript 5) ã§ã¯ Strict ã¢ã¼ãã¨ããï¼ããå³å¯ã«ææ³ãã§ãã¯ãè¡ãããã¢ã¼ãã®å°å
¥ãäºå®ããã¦ãã¾ããä»å¾ã¯ Perl ã®ããã« Strict ã¢ã¼ãã§ã¹ã¯ãªãããæ¸ãã®ã常èï¼ã¨ãªãå¯è½æ§ã¯é«ãããªã®ã§ï¼ä»ãã JavaScript ãè¦ããã®ãªãå³å¯ãªæ¸ãæ¹ã身ã«ã¤ãã¦ãããæ¹ãè¯ãã§ãããã
Strict ã¢ã¼ãã«ããããã«ã¯ï¼ã¹ã¯ãªããã®å
é ã«ä»¥ä¸ã®æååãæ¸ãè¾¼ã¿ã¾ãããã®ã³ã¼ãèªä½ã¯ãã ã®æååãªã®ã§ï¼ Strict ã¢ã¼ãã«å¯¾å¿ãã¦ããªããã©ã¦ã¶ã«ã¯ä½ã®å½±é¿ãä¸ãã¾ããã
"use strict";
2010å¹´2æç¾å¨ï¼Strict ã¢ã¼ãããµãã¼ããã¦ããå¦çç³»ã¯(ç§ã®ç¥ãéã)åå¨ãã¾ããããã®ããï¼ç¾ç¶ã§ã¯ Strict ã¢ã¼ãã宣è¨ããã¹ãã§ã¯ããã¾ãããç¾åãã Strict ã¢ã¼ãé対å¿ã®å¦çç³»ã§ã¯æ£ããåãã¦ããããã«ã¿ããã³ã¼ãã§ãï¼ã¡ãã£ã¨ãããã¹ãªã©ã«ãã Strict ã¢ã¼ãã«å¯¾å¿ããå¦çç³»ã§ã¯åä½ããªãå¯è½æ§ãããããã§ããStrict ã¢ã¼ãã«å¯¾å¿ããå¦çç³»ãå©ç¨ã§ããããã«ãªãã¾ã§ã¯ï¼ Strict ã¢ã¼ãã宣è¨ããªããã¨ããªã¹ã¹ã¡ãã¾ãã
æ
æã®æå¾ã«ã¯ã»ãã³ãã³ ( ; ) ãä»ãã¾ããä»ããªãå ´åã¯èªåçã«è£ããã¾ããï¼ãã¾ã«æå³ãã¬æåãèµ·ãããã¨ãããã®ã§ï¼æ £ããªããã¡ã¯ä»ããããããæ¹ãç¡é£ã§ãããã
å¤æ°ã®å®£è¨
var ã§å®£è¨ãã¾ããå¤æ°ã«åã¯ããã¾ããã
var hoge = 1; hoge = "a"; // æ°åãæåãä»£å ¥ã§ãã
宣è¨ãã¦ããªãå¤æ°ã«å¤ãä»£å ¥ãããã¨ãã§ãã¾ããï¼ãã®å ´åã¯ã°ãã¼ãã«å¤æ°ãä½ããããã«ä»£å ¥ããã¾ã (å³å¯ã«ã¯ã¡ãã£ã¨éãã¾ãã)ãæªå®ç¾©å¤æ°ã¸ã®ä»£å ¥æä½ã¯ Strict ã¢ã¼ãã§ã¯ã¨ã©ã¼ã«ãªãã®ã§ï¼å¤æ°ã使ãã¨ãã¯å®£è¨ããçãã¤ãã¦ããã®ãããã§ãããã
a = 1; // æªå®ç¾©å¤æ°ã¸ã®ä»£å
¥ã¯ã¨ã©ã¼ã«ãªããªã
æ°å¤
JavaScript ã®æ°å¤ã¯å ¨ã¦ãå®æ°åã§ããæ´æ°åã¨ããæ¦å¿µã¯ããã¾ããã
var d = 123456; // 10é²æ°ã®æ´æ° var h = 0xffff; // 16é²æ° var o = 0123; // 8é²æ° (Strictã¢ã¼ãã§ã¯æ§æã¨ã©ã¼ã«ãªãã¾ã) var f = 12.345; // å®æ°
æ°å¤æ¼ç®
JavaScript ã«ã¯å®æ°åãããªãã®ã§ï¼æ¼ç®ã®çµæãå®æ°åã«ãªãã¾ãããã ãï¼ ãããæ¼ç®ã®å ´åã¯å°æ°ç¹ä»¥ä¸ãåãæ¨ã¦ã¦æ´æ°ã«å¤æãã¦ããè¡ããã¾ãã
var a = 1 + 2; // => 3 a = 3 - 2; // => 1 a = 1 * 5; // => 5 a = 3 / 2; // => 1.5 (æ´æ°å士ã®å²ãç®ã§ãçµæã¯å®æ°) a = 3 % 2; // => 1 (ä½ã) a = 255.1 & 2.1; // == 255 & 2 => 2 (ãããæ¼ç®ã¯æ´æ°ã«å¤æ(å°æ°ç¹ä»¥ä¸åãæ¨ã¦)ãã¦ããè¡ããã) a = 12.3 >> 1; // => "6" (åä¸)
ä»£å ¥æ¼ç®åã¨ã¤ã³ã¯ãªã¡ã³ãã»ãã¯ãªã¡ã³ã
C ç³»è¨èªã¨åãããã«ä½¿ãã¾ãã
var a = 0; a += 3; // => 3 a -= 2; // => 1 a *= 3; // => 3 a /= 3; // => 1 a = 0; var b = a++; // => a == 1, b == 0 var c = ++a; // => a == 2, c == 2 var d = a--; // => a == 1, d == 2 var e = --a; // => a == 0, e == 0
æåå
æååã¯ã·ã³ã°ã«ã¯ãªã¼ã( ' )ãããã«ã¯ãªã¼ã ( " )ã§å²ã¿ã¾ãã両è ã¯å ¨ãç価ã§ããã·ã³ã°ã«ã»ããã«ã¯ãªã¼ãã®ã©ã¡ãã®å ´åã§ã \t (ã¿ã), \n (æ¹è¡) ãªã©ã®ç¹æ®æåãå©ç¨ãããã¨ãã§ãã¾ããä»ã®ã¹ã¯ãªããç³»è¨èªã«ããï¼å¤æ°å±éãªã©ã®ä¾¿å©ãªæ©è½ã¯ããã¾ããã
var a = "abc\tdef"; // "abc[tab]def" ([tab]ã¯ã¿ãæå) var b = 'abc\tdef'; // "abc[tab]def"
æååæä½
çµå
var join1 = 'aaa' + 'bbb'; var join2 = ['aaa', 'bbb', 'ccc'].join(','); // => 'aaa,bbb,ccc'
åå²
var record = 'aaa,bbb,ccc'.split(/,/); // => ['aaa', 'bbb', 'ccc']
é·ã
var length = 'abcdef'.length; // => 6 var jplen = 'ããããã'.length; // => 5
åãåºã (substrã¯å¤ãã®ç°å¢ã§ãµãã¼ãããã¦ãã¾ããéæ¨æºãªã¡ã½ãããªã®ã§ä¸å¿æ³¨æ)
var substr = 'abcd'.substr(1, 2); // => bc var substring = 'abcd'.substring(1, 2); // => b
æ¤ç´¢
// è¦ã¤ãã£ãå ´åã¯ãã®ä½ç½®ï¼è¦ã¤ãããªãã£ãå ´åã¯-1ãè¿ã var result1 = 'abcd'.indexOf('cd'); // => 2 var result2 = 'abcd'.indexOf('ef'); // => -1
é å
é åã®çææ¹æ³ããããã
var ary1 = [1, 2, 3]; // => [1, 2, 3] var ary2 = new Array(3); // => [undefined, undefined, undefined] var ary3 = new Array(3, 4, 5); // => [3, 4, 5]
é åã®åç §ã¨ä»£å ¥
var ary = [1, 2, 3]; ary[2]; // => 3 (é åã®ã¤ã³ããã¯ã¹ã¯0ãªãªã¸ã³) ary[0] = 3; // => ary == [3, 2, 3]
è¦ç´ ã®åæ°
ary.length
é åã®æä½
var ary = [1, 2, 3]; // å é ãåãåºã var a = ary.shift(); // => a == 1, ary == [2, 3] // å é ã«è¿½å ary.unshift(5); // => ary == [5, 2, 3] // æ«å°¾ãåãåºã var b = ary.pop(); // => b == 3, ary == [5, 2] // æ«å°¾ã«è¿½å ary.push(9); // => ary == [5, 2, 9] // é¨åã³ãã¼ãå¾ã var c = ary.slice(1, 2); // => c == [2], ary == [5, 2, 9] // ä¸é¨ãç½®ãæãã var d= ary.splice(1, 2, "a", "b", "c"); // => d == [2, 9], ary == [5, "a", "b", "c"]
é£æ³é å (ã®ãããªãã®)
JavaScript ã«ã¯é£æ³é åã¨ãããã®ã¯ããã¾ãããï¼ä»»æã®ãªãã¸ã§ã¯ããé£æ³é åã®ããã«æ±ããã¨ãã§ãã¾ãã
// ãªãã¸ã§ã¯ãã®å®ç¾©ãJSON ã¯ãã®è¡¨è¨æ³ãåºã«ãã¦ãã var a = {a: 123, b: 456}; a['a']; // => 123 (é£æ³é å風ã¢ã¯ã»ã¹) a.b; // => 456 (ããããã£é¢¨ã¢ã¯ã»ã¹) a['c'] = 789; // è¦ç´ ã®è¿½å a.d = 123;
以ä¸ã®ãããªæ¸ãæ¹ãå¯è½ã§ããï¼æ®éã¯ããã¾ããã
"abc"['length']; // => 3 (ããããã£ã®åå¾) "a,b,c"['split'](/,/); // => ["a", "b", "c"] (ã¡ã½ããå¼ã³åºã)
é£æ³é å風ã®ã¢ã¯ã»ã¹ã¨ããããã£é¢¨ã®ã¢ã¯ã»ã¹ã¯è¡¨è¨ãç°ãªãã ãã§æå³ä¸ã®å·®ã¯ããã¾ããã
å¶å¾¡æ
ifæ
if (æ¡ä»¶) { hoge(); fuga(); } // ifä¸ã®æã1ã¤ã ãã®å ´å㯠æ¬å¼§ ( "{", "}" ) ãçç¥å¯è½ if (æ¡ä»¶) hoge();
if-elseæ
if (æ¡ä»¶) { } else { }
else以ä¸ã«æ´ã«æ¡ä»¶åå²ãéããæã¯ä»¥ä¸ã®ããã«ãæ¸ãããããã¾ãã
if (æ¡ä»¶1) { // æ¡ä»¶1ãtrue } else if (æ¡ä»¶2) { // æ¡ä»¶1ãfalseã§æ¡ä»¶2ãtrue } else if (æ¡ä»¶3) { // æ¡ä»¶1, 2ãfalseã§æ¡ä»¶3ãtrue } else { // æ¡ä»¶1, 2, 3 ãfalse }
ä¸æ¬å¼§ãçç¥ããã«æ¸ãã¨ä»¥ä¸ã®ããã«ãªãã¾ãã
if (æ¡ä»¶1) { // æ¡ä»¶1ãtrue } else { if (æ¡ä»¶2) { // æ¡ä»¶1ãfalseã§æ¡ä»¶2ãtrue } else { if (æ¡ä»¶3) { // æ¡ä»¶1, 2ãfalseã§æ¡ä»¶3ãtrue } else { // æ¡ä»¶1, 2, 3 ãfalse } } }
whileæ
var i = 0; while (i < 5) { i++; }
foræ
for (var i = 0; i < 5; i++) { }
for inæ
var obj = {a: 1, b: 2}; for (var i in obj) { alert(obj[i]); // => 1, 2 }
for eachæ (Firefoxã®ã¿å¯¾å¿)
var obj = {a: 1, b: 2}; for each (var v in obj) { alert(v); // => 1, 2 }
Array#forEach (æè¿ã®ãã©ã¦ã¶ã®ã¿å¯¾å¿)
["a", "b", "c"].forEach(function(v, i) { alert(i + ": " + v); // => "0: a", "1: b", "2: c" })
switchæ
æ§æã¯Cã¨ä¸ç·ã§ããbreakãå¿ è¦ã
var a = 0; switch (a) { case 0: alert('zero'); break; case 1: alert('one'); break; case 2: // fall through case 3: alert('two or three'); break; default: alert('many!'); break; }
Cã¨ç°ãªãï¼caseã®å¾ã«ã¯å®è¡æã«è©ä¾¡ãããå¤ãå ¥ãããã¨ãã§ãã¾ãã
switch (a) { case a + '': alert('String'); break; case a + 0: alert('Number'); break; case !!a: alert('Boolean'); break; default: alert('Something'); break; }
é¢æ°
å¤ãã®å ´åï¼é¢æ°ã®å®£è¨ã¯ä»¥ä¸ã®ããã«æ¸ãã¾ãã
function sum3a(a, b, c) { return a + b + c; }
JavaScriptã®é¢æ°ã¯ãã¡ã¼ã¹ãã¯ã©ã¹ã®ãªãã¸ã§ã¯ããªã®ã§ï¼å¤æ°ã«ä»£å ¥ãããã¨ãã§ãã¾ãï¼é¢æ°å¼ï¼ã
var sum3b = function(a, b, c) { return a + b + c; };
sum3aã¯ã³ã³ãã¤ã«æã«å®ç¾©ããï¼sum3bã¯å®è¡æã«å®ç¾©ããã¾ãããã以å¤ã®ç¹ã§ä¸¡è
ã«å·®ã¯ããã¾ããã
Firefox ã®å ´åï¼returnæã ãå«ã¾ãããããªé¢æ°ã¯ï¼ä»¥ä¸ã®ãããªç縮表è¨ã使ãã¾ã (å¼ã¯ãã¼ã¸ã£è¨æ³)ã
var sum3b = function(a, b, c) a + b + c; // var sum3b = function(a, b, c) { return a + b + c; } ã¨ç価
ãã¡ã¤ã«å ¥åºå
ãããªãã®ã¯ãªã (ãã©ã¦ã¶ä¸ã§åä½ããJSã®å ´å)
ãµã¼ãã¨ã®éä¿¡ã¯è¡ãã¾ããç
©éãªã®ã§çç¥ (XMLHttpRequestã§ã°ã°ã£ã¦ãã ãã)
æ£è¦è¡¨ç¾
JavaScriptã§ä½¿ããæ£è¦è¡¨ç¾ãã©ã°ã»ç¹æ®æåã¯RegExp - JavaScript | MDNã«ã¾ã¨ã¾ã£ã¦ãã¾ãã
æ£è¦è¡¨ç¾ãªãã¸ã§ã¯ãã¯ä»¥ä¸ã®ããã«ãã¦ä½ãã¾ãã
var regex1a = /\d+/; // æ£è¦è¡¨ç¾ãªãã©ã«ãä½¿ç¨ var regex1b = new RegExp('\\d+'); // æååããçæ (regex1aã¨åå¤) var regex2a = /\s+/g; // g ãªãã·ã§ã³ãä»ä¸ var regex2b = new RegExp('\\s+', 'g'); // ã¹ã©ãã·ã¥ãããããå«ãã¨ãã¯æååããçæããæ¹ãèªã¿ããã var urlRegA = /^http:\/\/[^\/]+\/$/; var urlRegB = new RegExp('^http://[^/]+/$');
æååããçæããå ´åã¯ï¼ \d ãªã©ã®ç¹æ®æåã \\d ã¨æ¸ããªããã°ãªããªããã¨ã«æ³¨æãã¦ãã ããã
æ¤ç´¢
æ£è¦è¡¨ç¾ã使ã£ãæ¤ç´¢ã®æ¹æ³ã¯4種é¡ããã¾ãã
var regex = /[a-z](\d+)/; // ããããããå¦ãã ãã調ã¹ãã¡ã½ããã2ç¨®é¡ // RegExp#test regex.test('!!a123!!'); // => true regex.test('!!123!!'); // => false // String#search '!!a123!!'.search(regex); // => 2 "!!123!!".search(regex); // => -1 // 詳細ãªãããæ å ±ãå¾ãã¡ã½ããã2ç¨®é¡ // RegExp#exec var m1 = regex.exec('aaa123'); m1[0]; // => a123 (ãããããé¨åå ¨ä½) m1[1]; // => 123 (1ã¤ãã®æ¬å¼§ ( ) ã§ãã£ããã£ãããé¨å) m1.index; // => 2 (ãããããå ´æ) // String#match var m2 = 'aaa123'.match(regex); // ãã®å ´åå¾ãããçµæã¯RegExp#execã¨åã (m2 == m1)
æ£è¦è¡¨ç¾ã« g ãã©ã°ãè¨å®ãã㨠RegExp#exec, String#match ã®æåãå¤ããã¾ãã
ã¾ã㯠RegExp#exec ã«ã¤ãã¦ã
var s = '123'; var r = /\d/; // g ãã©ã°ãªã var rg = /\d/g; // g ãã©ã°ãã // g ãã©ã°ãç¡ãã¨æ¯ååãçµæ r.exec(s); // => 1 r.exec(s); // => 1 r.exec(s); // => 1 r.exec(s); // => 1 // g ãã©ã°ãããã¨ååã®ãããã®æ¬¡ã®é¨åããæ¤ç´¢ãéå§ãã rg.exec(s); // => 1 rg.exec(s); // => 2 rg.exec(s); // => 3 rg.exec(s); // => null
æååä¸ã®ãããããé¨åãã¹ã¦ã«ã¤ãã¦ä½ãå¦çãè¡ãããæï¼ä»¥ä¸ã®ãããªæ¸ãæ¹ãããããã¾ãã
var s = 'string'; var m; while((m = /[a-z]/g.exec(s)) !== null) { alert(m[0]); // => 's', 't', 'r', 'n', 'g' }
次㫠String#match ã®å ´åãg ãã©ã°ã®æãç¡ãã§å ¨ãç°ãªãæåã示ãã®ã§æ³¨æãå¿ è¦ã§ãã
var r = /\d(\d)\d/; var rg = /\d(\d)\d/g; // g ãã©ã°ç¡ãã®å ´å exec ã¨ããªã var m1 = '123456'.match(r); // => m1[0] == '123', m1[1] == '2', m1.index == 0 // g ãã©ã°ããã®å ´åï¼æååä¸ã®ãããããç®æå ¨ã¦ãå«ãã é åãè¿ã // æ¬å¼§ã§ãã£ããã£ããé¨åã®åå¾ã¯è¡ãã¾ãã var m2 = '123456'.match(r); // => [123, 456]
ç½®æ
"123".replace(/\d/, 'a'); // => 'a23' "123".replace(/\d/g, 'a'); // => 'aaa'
第2å¼æ°ã«æ¸¡ãæååä¸ã® $n (n > 0) ã¯æ£è¦è¡¨ç¾ä¸ã®æ¬å¼§ã§ãã£ããã£ããé¨åã¨ç½®ãæãããã¾ãã
// æ¬å¼§ã§ãã£ããã£ããé¨åãå©ç¨ãã "___a123___".replace(/[a-z](\d)(\d)(\d)/, '[[$1|$2|$3]]'); // => '___[[1|2|3]]___'
第2å¼æ°ã«ã¯é¢æ°ã渡ããã¨ãã§ãã¾ãã
var s = "___a123___".replace(/[a-z](\d)(\d)(\d)/, function(m0, m1, m2, m3) { alert(m0); // => 'a123' alert(m1); // => '1' alert(m2); // => '2' return m3; }); alert(s); // => ___3___
ä¾å¤å¦ç
try { throw new Error("ã¨ã©ã¼ï¼"); } catch(e) { alert("ã¨ã©ã¼ãçºçãã¾ããï¼ï¼\n詳細: " + e.message); } finally { alert("ããã¾ã"); }
throwã§æãããã¨ãå¯è½ãªãªãã¸ã§ã¯ãã«å¶éã¯ããã¾ããã
try { throw "aaa"; } catch(e) { alert(e); }
ã¨ã©ã¼ã®ç¨®é¡ãå¤å¥ããã«ã¯ä»¥ä¸ã®ããã«ãã¾ãã
try { doHogeHoge(); } catch(e) { if (e instanceof EvalError) { // do something. } else if (e instanceof RangeError) { // do something. } }
Firefoxã ã¨ä»¥ä¸ã®ãããªæ¸ãæ¹ãã§ãã¾ãã
try { doHogeHoge(); } catch(e if e instanceof EvalError) { // do something. } catch(e if e instanceof RangeError) { // do something. } catch(e) { // other error }
JavaScriptã®ãªãã¸ã§ã¯ãæå
JavaScript ã¯ãããã¿ã¤ããã¼ã¹ã®ãªãã¸ã§ã¯ãæåè¨èªã§ããå¤æ°ã«ä»£å
¥ã§ãããã®ã¯å
¨ã¦undefinedãªã©ã®ç¹æ®ãªå¤ãé¤ãã»ã¨ãã©ããªãã¸ã§ã¯ãã§ããã¨ãã¦åãæ±ããã¨ãã§ãã¾ãã(æ°å¤ãæååï¼true, falseãªã©ã¯ããªããã£ãå¤ã¨å¼ã°ããªãã¸ã§ã¯ãã§ã¯ããã¾ãããï¼ãããæ¼ç®åã§ããããã£ã«ã¢ã¯ã»ã¹ã§ãããªã©ï¼ãªãã¸ã§ã¯ãã¨ãã¦åãæ±ããã¨ãã§ãã¾ããããã¯ï¼ãªãã¸ã§ã¯ãçãªæ¯ãèããå¿
è¦ã¨ãããå ´åï¼ããªããã£ãå¤ãèªåçã«ãªãã¸ã§ã¯ãã«å¤æãããããã§ã)ã
ãªãã¸ã§ã¯ãã®å®ç¾©
var obj = {a: 123, b: 3}; obj.a; // => 123
ã¡ã½ãã
ã¡ã½ããã¯ããããã£ã«é¢æ°ãä»£å ¥ãããã®ã§ãã
var man = { hello: function() { alert('hello!'); }, bye: function() { alert('bye'); } }; man.hello(); // => hello!
ã¯ã©ã¹ã®ãããªãã®
é¢æ°ãä½ããã® prototoype ããããã£ãããããã¨ã§ã¯ã©ã¹ã®ãããªãªãã¸ã§ã¯ããä½ããã¨ãã§ãã¾ãã
// ã¯ã©ã¹ (ã®ãããªãã®) ã®å®ç¾© // ã³ã³ã¹ãã©ã¯ã¿ã¨ãªãé¢æ° var Man = function(name, age) { // ããããã£ã®åæå this.name = name; this.age = age; }; // ã¡ã½ããã»ããããã£ã®å®ç¾© Man.prototype = { sayName: function() { alert("My name is " + this.name + "."); } } // ã¤ã³ã¹ã¿ã³ã¹ã®ä½æ var bob = new Man('Bob', 35); bob.sayName(); // => My name is Bob.
ç¶æ¿
prototype ã«è¦ªã¯ã©ã¹ã®ãªãã¸ã§ã¯ããä»£å ¥ãããã¨ã§ç¶æ¿ãå®ç¾ã§ãã¾ãã
var Animal = function() {}; Animal.prototype = { sleep: function() { alert('zzz...'); } }; var Human = function() {}; Human.prototype = new Animal(); Human.prototype.workHarder = function() { alert("I'm tired..."); this.sleep(); }; var me = new Human(); me.workHarder(); // => I'm tired... => zzz...
éå¤ãªtips
çå½å¤
JavaScript ã§ã¯ä»¥ä¸ã®å¤ã false ã¨ãã¦æ±ããã¾ãã
- false (Boolå)
- 0 (å®æ°å)
- "" (空æå)
- null, NaN, undefined
ãã以å¤ã¯å ¨ã¦ true ã¨ãã¦æ±ããã¾ãã
==ã¨===
==ã«ããæ¯è¼ã¯èªåçã«åå¤æãè¡ããã¦ããæ¯è¼ãããããï¼æå³ãã¬çµæãããããå ´åãããã¾ãã
'0' == 0; // => true '' == 0; // => true '100' == 100 // => true
ãã®ãããªäºæ ãé²ãããã«ï¼åå¤æãè¡ããªãæ¯è¼æ¼ç®å === ãç¨ããã¨ããã§ãããã
'0' === 0; // => false '' === 0; // => false '100' === 100 // => false
å¤æ°ã®ã¹ã³ã¼ã
å¤æ°ã®ã¹ã³ã¼ãã¯å®£è¨ããé¢æ°å å ¨ä½ã«ãªãã¾ããé¢æ°å ã®ã©ã®ä½ç½®ã§å¤æ°å®£è¨ãã¦ãï¼é¢æ°å å ¨ä½ãããã®å¤æ°ãåç §ã§ãã¾ãã
var a = 0; function() { alert(a); // => undefined (é¢æ°å ã§å¾ã«å®ç¾©ããaãåç §ãããã) var a = 1; // ãã㧠a ã«å¤ãä»£å ¥ããã if (true) { var b = 1; // ããã§å®ç¾©ãã b ã¯é¢æ°å ãªãã©ãããã§ãåç §åºæ¥ã } alert(b); // => 1 (ifæã®ä¸ã§å®£è¨ãã b ãåç §ã§ãã) }
Firefox ã ã¨ä»¥ä¸ã®ããã«ãã¦ã¹ã³ã¼ãããããã¯å ã«éå®ãããå¤æ°ã宣è¨ãããã¨ãã§ãã¾ãã
if (true) { let b = 1; } alert(b); // => æªå®ç¾©ã¨ã©ã¼ (letã§å®£è¨ããã¨ã¹ã³ã¼ããifæã®ä¸ã«éå®ããã)
thisã®æãç©
ã¡ã½ããå ã§ä½¿ããã¦ãã this ãæããã®ã¯ï¼ãã®ã¡ã½ããã®å¼ã³åºããæ¹ã«ãã£ã¦å¤ããã¾ããå ·ä½çã«ã¯ï¼ obj.hoge(); ã®å½¢ã§å¼ã³åºãããå ´åï¼thisã¯objã«ãªãï¼hoge();ã®å½¢ã§å¼ã³åºãããå ´åã¯this㯠window (ã°ãã¼ãã«ãªãã¸ã§ã¯ã) ã«ãªãã¾ãã
var smith = { name: "Smith", sayName: function() { alert(this.name); } }; smith.sayName(); // => Smith var john = {name: "John"}; john.sayName = smith.sayName; // é¢æ°ãä»£å ¥ john.sayName(); // => John var sayName = john.sayName; sayName(); // => undefined (thisãwindowãæãããthis.name == window.name == undefined)
thisã®æããã®ãæ示çã«ãã¦ããã¦é¢æ°ãå¼ã³åºãã«ã¯ï¼ Function#call ã Function#apply ã使ãã¾ãã
// ä¸ã®ã³ã¼ãã®ç¶ã sayName.call(smith); // => Smith (thisãsmithãæã) sayName.apply(john); // => John (thisãjohnãæã)
Function#call 㨠Function#apply ã®éãã¯ï¼å¼ã³åºãããé¢æ°ã«æ¸¡ãå¼æ°ã®æå®ã®ä»æ¹ã§ããapply ã¯é åã¨ãã¦å¼æ°ã渡ãã¦ããã¾ãã
function hoge(a, b, c) { return a + b + c; } // 以ä¸ã¯åãæå³ hoge(1, 2, 3); // => 6 (this 㯠window ãæã) hoge.call(null, 1, 2, 3); // => 6 (this 㯠window) hoge.apply(null, [1, 2, 3]); // => 6 (this 㯠window)
æ¢åã®ãªãã¸ã§ã¯ãã®æ¡å¼µ
æ¢åã®ãªãã¸ã§ã¯ãã® prototype ãããããã¨ã§æ¢åã®ãªãã¸ã§ã¯ããæ¡å¼µã§ãã¾ãã
[1, 2, 3].sum(); // => Error (sum is not a function) Array.prototype.sum = function() { var sum = 0; for (var i = 0; i < this.length; i++) { sum += this[i]; } return sum; }; [1, 2, 3].sum(); // => 6
for inæã®è½ã¨ãç©´æ¢åã®ãªãã¸ã§ã¯ãæ¡å¼µã®è½ã¨ãç©´
for in æã«ã¯ prototype ã§å®ç¾©ãããããããã£ãåæãã¦ãã¾ãã®ã§æ³¨æãå¿ è¦ã§ãã
Object.prototype = {doHoge: function() {}}; var obj = {a: 1, b: 2}; for (var i in obj) { alert("i = " + obj[i]); // => "a = 1", "b = 2", "doHoge = function() {}" }
ãã®ãããªæåãåé¿ããããã«ã¯ï¼ hasOwnProperty ã使ã£ã¦ãã®ãªãã¸ã§ã¯ãèªä½ãæã£ã¦ããããããã£ãã©ããã確èªãã¾ãããã
Object.prototype = {doHoge: function() {}}; var obj = {a: 1, b: 2}; for (var i in obj) { if (obj.hasOwnProperty(i)) alert("i = " + obj[i]); // => "a = 1", "b = 2" }
æ¢åã®ãªãã¸ã§ã¯ãï¼ç¹ã«å ¨ã¦ã®ãªãã¸ã§ã¯ãã®ãããã¿ã¤ãã§ãã Object.prototype ãæ¡å¼µããå ´åã¯å¹æç¯å²ã大ããã®ã§æ éã«è¡ã£ã¦ãã ããã
JavaScriptåèè³æ
è¨èªãªãã¡ã¬ã³ã¹
MDCã®ããã¥ã¡ã³ããããã¾ã¨ã¾ã£ã¦ãã¦ä½¿ããããã§ãã
JavaScriptã®ãªãã¸ã§ã¯ãæåã«ã¤ãã¦
èªåã¯ä»¥ä¸ã®ãã¼ã¸ã§ãªãã¸ã§ã¯ãæåãå¦ã³ã¾ãã