javascript - ncsjfor/in •for / in –for(variable in object) statement •variable: •object :...

75
JavaScript JavaScript NCSJ2018

Upload: others

Post on 23-May-2020

33 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

JavaScript

JavaScript����NCSJ2018

��� ������

Page 2: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

JavaScript" �

• ��������–��(��� ���

• ��� ��#�C/C++�Java����&• ����'��&– ECMAScript

• )1,2.0,2-/*+!�%�$'����'&

1directec co.,ltd. NCSJ2018

Page 3: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

JavaScript���

• JavaScript��

<html><head><title>JavaScript</title></head><body><hr/><script>

document.write(“Hello,JavaScript!!”);</script></body></html>

2directec co.,ltd. NCSJ2018

Page 4: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

����

• ��–���������� �

• ��– ‘ ��� “ ���– Unicode�����

• ���– true / false

3directec co.,ltd. NCSJ2018

Page 5: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

$*"�

• ���–������–��� ����

• ���–�������–�'!� %�• ������'!� %�• ()&#����������

4directec co.,ltd. NCSJ2018

Page 6: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

��

• JavaScript���–������� �����

i.e. JavaScript��������

// ���� � x = 0;y = 0;

// ���� �var a;var b;var m, n;

5directec co.,ltd. NCSJ2018

Page 7: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

.-92

• �$.-92– ,8906 �

• 28,54�� ����

– 89*6 �• ��� ���(' �• �)�����'��� $&����• ,8906 �!���$��89*6 �����('

• 89*6 �$���#%�var�)���"�• 18/+736$.-92%"�

6directec co.,ltd. NCSJ2018

Page 8: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

&/)%'-

• JavaScript��&/)%'-–������ ���" ����

• 02.,#–&/)%'-����"��� ���–���02.,#�����!��

• (3*-1'+–&/)%'-�$3*+3*"�����������

7directec co.,ltd. NCSJ2018

Page 9: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

• �–� �� � Array()�����• �� var array = new Array();

–����� � [ ] ����� ��• �� var array = [“Red”, “Green”, “Blue”];

8directec co.,ltd. NCSJ2018

Page 10: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

�0&0$"- #*/

• JavaScript�(),�–�������������� ������–%.!+'���������

9directec co.,ltd. NCSJ2018

Page 11: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

���

• ����– �� +–�� -–�� *–��� /–��� %–������� ++–������� --

10directec co.,ltd. NCSJ2018

Page 12: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

��

• ���–�� <–�� <=–��� ==–�� >=–�� >

11directec co.,ltd. NCSJ2018

Page 13: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

���

• ����– AND &&– OR ||– NOT !

12directec co.,ltd. NCSJ2018

Page 14: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

���

• �����–��� ��������

– if– while– for– for/in

13directec co.,ltd. NCSJ2018

Page 15: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

if

• if–���������"�! �� ����

if( expression ){

����"����expression��#true$����� ���

}

if( expression )������expression��#true$����� ���

14directec co.,ltd. NCSJ2018

Page 16: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

if

• if / else if / else– if : ������– else if : # ��������– else : if / else if �� ��������

if( 1st expression ){���������������"!

}else if( 2ndexpression ){

���������������"!}else{

���������"�� ������������"!}

15directec co.,ltd. NCSJ2018

Page 17: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

switch

• switch / case–����#���!������"!

switch( x ){case 1:

� x ���$����� �"!break;

case 2:� x ���%����� �"!break;

case 3:� x ���&����� �"!break;

default:� x ��������"������ ������ �"!break;

} 16directec co.,ltd. NCSJ2018

Page 18: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

while�

• while–������� #�"!�������

while( expression ){

���#��� expression��$true%����� �������

}

while( expression )����� expression��$true%����� �������

17directec co.,ltd. NCSJ2018

Page 19: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

for

• for–���������"!&%�������$&# � ��

– for(initialize ; condition; increment'• initialize ���(�������

• condition ���������

• increment �����������

18directec co.,ltd. NCSJ2018

Page 20: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

for/in�

• for / in

– for(variable in object) statement

• variable : ��

• object : �������� �����������

• statement : ���������

var array = [1,2,3,4,5,6,7,8,9,0];for( var x in array){

document.write(“x = ” + x + “<br>”);}

19directec co.,ltd. NCSJ2018

Page 21: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

function

• function$�������– function�����������–���� ��"#���������–������ !�������������–����return����

function ���( x, y ){����

return value;}

20directec co.,ltd. NCSJ2018

Page 22: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

��

• throw– ��*,/01�������2�(– �##��$���)(– throw expression;

• try/catch/finally– try

• ��*����(���#�(�*�&./-+– catch

• ��') ��* %� !�"���(./-+– finally

• ����)(./-+

21directec co.,ltd. NCSJ2018

Page 23: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

with�

• with–�����������

with( document.forms[0] ){// ������� �document.forms[0]�����name.value = “”;addr.value = “”;tel.value = “”;mail.value = “”;

}

22directec co.,ltd. NCSJ2018

Page 24: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

�����

• ��������

• ���� �����������

var data = { name:”no-name”, value:0 };

var now = new Date();

23directec co.,ltd. NCSJ2018

Page 25: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

�!�����

• �!�����–������ �����• � �����• ������

function Person(name, addr, mail){// ���� �����this.name = name;this.addr = addr;this.mail = mail;// ���������this.print = function() { document.write( this.name ); }

}

24directec co.,ltd. NCSJ2018

Page 26: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

�'!� %�()&$�

• ()&$���� #"– var x = {p:0, q:0};– x.p = 100;• ������* . +������()&$����

• ()&$����– in �����()&$����– if( “p” in x ) x.p = 100;

• ()&$����– delete x.p;

25directec co.,ltd. NCSJ2018

Page 27: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

"��

• �!�����"�� – # . $���"�� ���������– "�� ������() ��• (�)���������

var bond = new Person(“James Bond”, “London”, “[email protected]”);

bond.print();

26directec co.,ltd. NCSJ2018

Page 28: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

��

• ��–���� ���� ����–�� ��������$#"������• [ index ]

–��������#%!������

27directec co.,ltd. NCSJ2018

Page 29: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

��*;57:

• ��*;57:– Array3<4*;57:

• join() $,'*��2��)#��$1• reverse() ��*��*��2��"%1• sort() ��25=9$1• concat() ��2��#'��&(��2��$1• slice() �#&��!/��2�0�$• splice() ��*��-&+��2��• push() / pop() 4673*.�) 1• shift() / unshift() ��*8=62�����$1• toString() ��)$1

28directec co.,ltd. NCSJ2018

Page 30: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

��

• ����– function������–$'&)!����*��+� ���–%("�����{ �� }� ���–��������return�����

–�����% ��#���

29directec co.,ltd. NCSJ2018

Page 31: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

��.0,*$

• length.0,*$–�/)+�� �"���

• prototype.0,*$–������� ��prototype.0,*$����"!• �����constructor��

• .0,*$�� Function&-(%'+�.0,*$#����!���!����� �#���!

30directec co.,ltd. NCSJ2018

Page 32: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

��"351/)

• length351/)–�4.0����'��"�• ��#�"�"�(���&�����&• ��"length351/)#������"���&

– ��!������"��#� &• ��6Function+2-*,07"���%$� ��&

31directec co.,ltd. NCSJ2018

Page 33: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

���(*&$�

• prototype(*&$�–�����������(*&$�– +"%)�#������������–��������� ��• ����(*&$�����'!��%������

32directec co.,ltd. NCSJ2018

Page 34: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

� -.+)$

• -.+)$ ��– Function&,(%'*����� -.+)$#��/���"�����"

–� ��� ����!��#�����r�����"

Person.count = 0;

function Person(){return Person.count++;

}

33directec co.,ltd. NCSJ2018

Page 35: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

�������

• apply()����f.apply(obj, [x, y]);

f obj�����obj ���������� ��

[x,y] �����• call()����

f.call(obj, x, y);

34directec co.,ltd. NCSJ2018

Page 36: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

����!�

• JavaScript�����!�–����!�• ������!�• ������!�����• ������!���! ������

– ������������ ����

35directec co.,ltd. NCSJ2018

Page 37: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

Call-30,/2

• Call-30,/2&��–�����%� )(–��&�412��� )(–��&67.5��'�� )(–��&����*($�Call-30,/2'��(

• ����$!#Call-30,/2+��–��&��+��"(�$�� (

36directec co.,ltd. NCSJ2018

Page 38: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

�����

• ������Closure�– ����������� ���� �����

function makeProp(obj, name, func){var value;obj[“get” + name] = function() { return value; };obj[“set” + name] = function( v ){

if(func && func(v)){ throw “set”+name+”:invalid value ”+v; }else{ value = v; }

};}var o = {};makeProp(o,”Name”,function(x){ return typeof x == “string”; });

o.setName(“Naoto”);document.write( o.getName() );

37directec co.,ltd. NCSJ2018

Page 39: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

Client Side JavaScript

• �����JavaScript• HTML������• � �����• ��������• �����• ��� ���• �� ���

38directec co.,ltd. NCSJ2018

Page 40: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

Client Side JavaScript

• &-� ��JavaScript– Window�&!��$• JavaScript�� ���/#�"$• %�,+/$1HTML��2�������/%�

–�&!��$����• Window�&!��$��������

–�(/$����'.�-*/�• )�"�(/$• �0�(/$

39directec co.,ltd. NCSJ2018

Page 41: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

Client Side JavaScript

• HTML��� ���– <script>$#• <script>��</script>�������

<script language=“javascript”>���JavaScript ��

</script>

• <script>$#�src�����archive�����<script src=“sample.js”></script>(!"+������.js

• HTML�"),%',&*�������

40directec co.,ltd. NCSJ2018

Page 42: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

Client Side JavaScript

• �������–����� ����• w = window.open();

– URL– ����� ����– ����� ��– � ����� true / false

–����� ����• w.close();

– ������������

41directec co.,ltd. NCSJ2018

Page 43: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

Client Side JavaScript

• �������– Location / Window�location���• href���• search ���• protocol ���• host ���

42directec co.,ltd. NCSJ2018

Page 44: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

Client Side JavaScript

• ������– History• Window�history����

• back() ��• forward() ��

43directec co.,ltd. NCSJ2018

Page 45: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

Client Side JavaScript

• ��������– location����������� �

location = “sample.html”;– reload() ����

location.reload();– replace() ����

location.replace(url)url���� �������������history������

44directec co.,ltd. NCSJ2018

Page 46: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

Client Side JavaScript

• �!$���–�!$��$�#• �!$��$�#�������������

– HTML�• �!$��$�#�HTML�����"%����

– #������� �

45directec co.,ltd. NCSJ2018

Page 47: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

Client Side JavaScript

• �� ��–���������� ��• onclick• onsubmit• ondblclick• onmousemove• onmouseover• onmouseout• onmousedown• onmouseup

46directec co.,ltd. NCSJ2018

Page 48: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

Client Side JavaScript

• ������– onkeydown– onkeypress– onkeyup

47directec co.,ltd. NCSJ2018

Page 49: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

)!-,/(���

• DOM– Document Object Model• )!-,/(����� *%�"(�����"'&���1API2• DOM LEVEL 0

– ���*.�$������#+0(�����– Netscape �

• W3C DOM– W3C���– LEVEL 1 � 3��– http://www.w3.org/DOM/

48directec co.,ltd. NCSJ2018

Page 50: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

����� ���

• Document���� – ���

• write���• open���

– �����• bgColor• cookie• domain• lastModified• referrer• title• URL

49directec co.,ltd. NCSJ2018

Page 51: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

���� ���

• Document���� –�������• anchors[]• applets[]• forms[]• images[]• links[]

50directec co.,ltd. NCSJ2018

Page 52: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

"�'&)!���

• Document�$���!–��%(#����������

<html><body><form name=“form1”><input type=“text” value=“Hello!!”></form></body></html>

���� �����document.forms[0]

���%(#��� �����document.forms.form1

����) ���������document.forms[form1]

"�'&)!�%(#��� �document.form1

51directec co.,ltd. NCSJ2018

Page 53: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

"�'&)!��

• Document�$���!

–�%)!#)"(• �)�(� �$�����������• "�'&)!���������� �

<form name=“form1” onsubmit=“return check()”>

FIELD1 : <input name=“field1” type=“text” size=20><br>

FIELD2 : <input name=“field2” type=“text” size=20><br>

<input type=“button” value=“PUSH” onclick=“push()”>

<input type=“submit”>

</form>

52directec co.,ltd. NCSJ2018

Page 54: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

W3C DOM

• W3C ���DOM–��������–���������• ���• ��

– DOM HTML API– DOM LEVEL

53directec co.,ltd. NCSJ2018

Page 55: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

W3C DOM

• ����������

Document

<head>

<body>

<title>

<p>

<h1>

<hr>

<html><head><title>TITLE</title></head><body><h1>DOCUMENT</h1><hr/><p align=“center”>CONTENTS…</p></body></head>

54directec co.,ltd. NCSJ2018

Page 56: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

W3C DOM

• ���– ������• Element• Text• Document• Comment• DocumentFragment• Attr

55directec co.,ltd. NCSJ2018

Page 57: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

W3C DOM• ���������

Document

Node

CharacterData Element Attr

CommentTextHTMLDocument HTMLElement

HTMLHeadElement HTMLBodyElement HTMLParagraphElement

56directec co.,ltd. NCSJ2018

Page 58: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

W3C DOM

• Element��• � �����Element,.+�!%&('��#

–���%&('• �� / getAttribute()-)*+• �� / setAttribute()-)*+• �� / removeAttribute()-)*+

• Attr��"��– getAttributeNode()-)*+$��– "����$�#�����#

57directec co.,ltd. NCSJ2018

Page 59: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

W3C DOM

• Attr���• Element������������"�#��#�• �� �"��!#� ����

– Attr�����• getName()

• getSpecified()

• getValue()

• setValue()

• getOwnerElement()

– DOM LEVEL 2

• getSchemaTypeInfo()

– DOM LEVEL 3

• isId()

– DOM LEVEL 3

58directec co.,ltd. NCSJ2018

Page 60: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

W3C DOM

• DOM HTML API– DOM��• XML / HTML�������

– Node, Element, Document

• HTML ������– HTMLDocument

» HTML���������– HTMLElement

» HTML����������������

59directec co.,ltd. NCSJ2018

Page 61: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP���

• Ajax• XMLHttpRequest• ������• ���� ��• ����� ��

60directec co.,ltd. NCSJ2018

Page 62: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP���

• Ajax• Asynchronous JavaScript and XML

– Ajax: A New Approach to Web Applications– Jesse James Garrett, FEB/2005

– XMLHttpRequest��� ���JavaScript�������• HTTP�JavaScript����• ��������• � ���� �������

61directec co.,ltd. NCSJ2018

Page 63: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP���

• XMLHttpRequest– Client Side JavaScript ��HTTP�–������������HTTP�������– Ajax��������

62directec co.,ltd. NCSJ2018

Page 64: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP���

• XMLHttpRequest���������–������!�� ������� ��– IE7����������

var request = new XMLHttpRequest();

– IE7��var request = new ActiveXObject(“Msxml2.XMLHTTP”);

var request = new ActiveXObject(“Miscrosoft.XMLHTTP”);

63directec co.,ltd. NCSJ2018

Page 65: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP���

• 2%$(.���–'505����• open()1)+/

request.open(method, url, mode);method : “GET” or “POST”url : ����URLmode : true(=���) or false(=��)

• GET– ���URL� &4-4,"*#435/

• POST– 2%$(.���������"�!�����!

64directec co.,ltd. NCSJ2018

Page 66: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP��

• ��6)38)– ����6)38)

• XMLHttpRequest�open()4*,/�����#����"�����6)38)#���!����!

– 6)38)���• 5&%).#��:send()4*,/�� ;��(909� 6)38)����"!

• 6)38)��5&%).�status271-$– send()4*,/� 5+98�� "��– )-9+)'9/

» 200 : SUCCESS» 404 : NOT FOUND

65directec co.,ltd. NCSJ2018

Page 67: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP��

• ���)#'*#– XMLHttpRequest�open()($%&�����"���!������)#'*#"��� ����

• +�������true"�� • � ������true��

66directec co.,ltd. NCSJ2018

Page 68: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP"�

• ���@0<B0–@0<B0"��• ?/.05����send()=236#9A3/�) �• @0<B0#�status:A84,%135�)(• @0<B0"��#�-;B57B6>!&'�*)(

–@0<B0"-;B57B6>• onreadystatechange+���(

– readyState:A84,"����(�$��)(– readyState:A84,

» HTTP?/.05"��+�����

67directec co.,ltd. NCSJ2018

Page 69: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP��

• XMLHttpRequest– readyState�����0 open()�������!����1 send()�������!����2 &"%'"���������

3 $(#���*IE�FireFox������ � �

4 ���

68directec co.,ltd. NCSJ2018

Page 70: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP���

• HTTP HEAD#��� –����URL�"������

• HTTP�%!%��"��%��� ��

• �$�$�����

– XMLHttpRequest����HTTP HEAD�

XMLHttpRequest request = new XMLHttpRequest();request.open(“HEAD”, url);request.send(null);

69directec co.,ltd. NCSJ2018

Page 71: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP���

• HTTP POST– POST��������������

var request = new XMLHttpRequest();request.onreadystatechange = function(){

if(request.status == 200){// POST�����

}else{

// ���� ���}

}request.open(“POST”, url);request.setRequestHeader(“Content-Type”,”application/x-www-form-urlencoded”);request.send( formData );

70directec co.,ltd. NCSJ2018

Page 72: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP���

• JSON����������� ��– JSON : JavaScript Object Notation

{"name": ”Soseki Natsume”,"books": [

”Neko”,”Sanshiro”,“Sorekara”,“Kokoro”

]}

71directec co.,ltd. NCSJ2018

Page 73: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP���

• XML����������� ��

<author><name>Soseki Natsume</name><books>

<book>Neko</book><book>Sanshiro</book><book>Sorekara</book><book>Kokoro</book>

</books></author>

72directec co.,ltd. NCSJ2018

Page 74: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

HTTP(��

• 6.;-/8– XMLHttpRequest')�6.;-/8�&�• �(��%�� ���+

– Window2:4038,��!+• Window.setTimeout()<579

– Window'$6.;-/8,�%�+

• Window.clearTimeout()<579– ��� #��)�6.;-/8,3>-!+ ���+– 6.;-/8(��)�XMLHttpRequest.abort(),�*�!

» "(��1=?(���,��

73directec co.,ltd. NCSJ2018

Page 75: JavaScript - NCSJfor/in •for / in –for(variable in object) statement •variable: •object : •statement : vararray = [1,2,3,4,5,6,7,8,9,0];

NCSJNovice Class Seminar – Java Programmer

��� ������

JavaScript����