> 웹 프론트엔드 > JS 튜토리얼 > 자바스크립트 학습 입문_기본지식

자바스크립트 학습 입문_기본지식

PHP中文网
풀어 주다: 2016-05-16 19:00:42
원래의
1027명이 탐색했습니다.

저자는 처음 언어를 배울 때마다 "hello world"라는 예문을 사용하여 우리의 IQ를 모욕하는 것을 좋아합니다. 그래서 저는 몇 마디 썼습니다.

<html>
<머리 >
<meta http-equiv ="콘텐츠 유형" 콘텐츠="text/html;charset=gb2312">
<제목 >Document.writeln()방법제목>
<스크립트 언어="javascript" >
함수 createsummary()
{
     win2
=open( "","window2")
     
//win2.document.open("text/plain")
     win2.document.writeln(" 제목" document.title)
     win2.document.close()
}
스크립트>
머리>
<>
<이름="#top">< /a>
    
<양식>
       
<입력 유형="버튼 " 이름="도움말" 값= "도움말"onClick="createsummary( )">
양식>
<본문>
html>

말해 보세요. 지식 포인트:

1: JavaScript는 대소문자를 구분하는 언어입니다.

2: 각 줄에 ';' 사용을 권장합니다.

3: 이름의 첫 글자는 문자, 밑줄 또는 '$'여야 합니다. >4: 변수는 JavaScript에서 var를 사용하여 선언되며 영구적입니다.

5: 블록 수준 범위가 없습니다. 예:

Var 범위

="globle";
function
f(){ Alert(scope);
//
"globle" 대신 "underfined" 표시
Var 범위
="로컬" ; Alert(scope);}
F();

는 다음 코드 예시와 의미가 같습니다

Var range

="globle";function f(){ Var 범위
경고(범위);

//
"globle" 대신 "underfined" 표시
Var 범위
="로컬"; 경보(범위);}
F() ;

제안: 함수 시작 부분에서 모든 변수 선언을 수집하는 것은 좋은 프로그래밍 습관입니다.

6: ECMAScript 표준에서는

function

doadd(i){ Alert(i); }


함수
doadd(i){ Alert(i);}doadd(

10
);후자의 함수가 실제로 실행되고, 두 번째 함수가 첫 번째 함수를 덮습니다.

7: 인수 객체 사용.

함수

doAdd() If(arguments.length==
1){   alert(인수[0
] 10);} If(arguments.length

==
2){ Alert(arguments[0
] 인수[0);}doAdd(

10
);doAdd(10
,20); 실행 효과: 약간...

8: JavaScript 배열 사용 방법



1.join()

array.join은 모든 요소를 ​​넣습니다. 배열에서 문자열로 변환한 다음 선택적으로 문자열로 구분된 요소를 지정할 수 있습니다. 기본값은 ","입니다.

vara = [1,2,3];

var s = a.join(); ==> s="1,2 ,3"

s
= a.join(","); ==>="1, 2, 3"! 결과가 약간 다릅니다

array.join()은 String.split()과 반대입니다(문자열을 여러 조각으로 분할하여 배열 만들기)

2.reverse ()

array.reverse()는 배열 요소의 순서를 반대로 바꾸어 반전된 배열을 반환하고 원래 배열에 대한 작업을 수행합니다.

var = new 배열(1,2,3) 🎜>] =1, a[1] = 2, a[ 3] = 3a.reverse();  ==>a[1

]
= 3, a[2] = 2 , a[3] = 1var s =

a.join()
==>s = "3,2,1"3.sort()array.sort() 배열의 요소를 정렬하고 정렬된 배열을 반환합니다. 그렇지 않으면 기본값은 알파벳순입니다. 비교 함수는 sort() 매개변수로 전달되어야 합니다

var a = new 배열("A""C", "B");

a.sort();

var s = a.join("/" );  ==>= "A/ B/ C";

var a = [134];

a.sort(

    
기능(a,b)

    {

         
반환 a - b;

    }

) ;    
==><0,0,>0返回 13 4

toLowerCase(), toUpperCase()转换字母大小写

4.concat()

배열을 만들고 반환합니다. 包含调用concat()적 hararay中的요소, 其后是concat()参数,若为array将被被被开

但不能递归被开

var a = [1,2,3];

a.concat(
4,5);   ==>[1,2,3,4,5]

a.concat([
4,5], [6,7]); ==>[1,2,3,4,5,6 ,7]

a.concat(
4, [5 , [67]]);  ==>[1,2,3,4,5,[6,7] ]

5.slice()

array.slice( )는 하나의 배열을 슬라이스로 반환합니다. 매우 유용합니다. 요소, 배열의 요소, 배열의 요소

-1개의 배열 요소, -3개의 배열 요소, 요소의 요소

vara = [1,2,3,4,5];

a.slice(
0,3) >[1 ,2,3] a.slice(
3
) 🎜>,5]a.slice(1 ,-1
) 3
, 4]a.slice(-3, -2); >==>[3]

6.splice()array.splice()는 삽입 또는 삭제 또는 요소 삽입 삭제 방법 모두에 보편적이며 원래 배열에서 수정되며 삽입 또는 삭제된 후 요소는 필요에 따라 이동됩니다. >처음 두 매개변수는 삭제를 참조합니다. 첫 번째 매개변수는 삭제할 배열 요소의 위치를 ​​지정하고, 두 번째 매개변수는 삭제를 지정합니다. 이 두 매개변수 뒤에는 삽입할 요소를 지정하는 N개의 매개변수가 있을 수 있습니다. 매개변수 1에 지정된 위치에서

var a = [1,2,3,4,5,6,7,8]

var a.splice(4);    ==>반품[5,6,7,8]  a=[1,2,3,4 ]

a.splice(
1,2);      ==>반품[2,3]  a=[1,4]

a.splice(
1,1);     ==>반품[4] a=[1]

var a = [1,2,3,4 ,5]

a.splice(
2,0,'',' b');     ==>返回[] a =[1,2,'a',' b',3,4,5]

a.splice(
2,2,[1, 2},3) ==>반환 ['a','b' ] a =[1,2, 3,[1,2],3,3,4,5]

7.push() pop()

Stack()과 같은 배열을 사용하고 원래 배열을 수정합니다. FILO(선입후출) push()는 다중 요소는 배열 끝에 추가되어 새 배열 길이 pop()을 반환합니다. 대신 배열의 마지막 요소를 삭제하고 array() 길이를 빼고 삭제된 값을 반환합니다

var 스택 = [];

stack.pust(
1 ,8);    ==>[1,8]  return 2

stack.pop();         
==>[1]  반품  8

stack.push(
3);    ==>[1,3]  return 2

stack.pop();     
==>[1]  반품  3

stack.push();    
==>[1,[4,5] ] 반환 2

stack.pop();     
==>[1반품 [4,5]

stack.pop();    
==>[]  반품 [1]

8.unshift()shift()

与push() pop()상似 只是在array的头부进行insert delete 而不在尾文unshift ()새 배열 길이를 반환하고, N개 요소를 삽입합니다.

var a = [];

a.unshift(
1 );    ==>a:[1]  반품 1

a.unshift(
22);   ==>a:[22,1 반환 2

a.shift();      
==>a:[1]  return22

a.unshift(
3, [4,5]);   ==>a:[3,[4,5]],1반품 3

a.shift()    
==>a:[[4,5], 1]  반품 3

a.shift()  
==> a:[1]  반환[4,5]

a.shift( ) 
==>a:[] 반품 1

9.toString() toSurce()

[
1, 2,3].toString();    ==>"1,2,3"

[
'a'"b" "c"].toString();  ==>"a,b,c"

[
1,[2.'c ']].toString();  ==>"1,2,c"

toLocaleString()은 toString의 지역화된 버전으로, 각 요소의 toLocaleString() 메서드를 호출하여 배열 요소를 문자열로 변환합니다. 그런 다음 생성된 문자열은 로컬 특정(및 구현 정의) 구분 기호

9:

Global 객체와 연결됩니다. 실제로 ECMAScript에서 가장 특별한 객체이기 때문입니다. 그것은 전혀 존재하지 않습니다. 다음 코드를 작성하려고 하면 오류가 발생합니다.

오류 메시지는 Global이 개체가 아니지만 개체가 아니라는 것을 보여줍니다. t 그냥 Global이 객체라고 말하는 거죠? 여기서 이해해야 할 주요 개념은 ECMAScript에는 독립적인 함수가 없으며 모든 함수는 일부 객체의 메서드여야 한다는 것입니다. isNaN(), isFinite(), parseInt(), parseFloat() 등 이 책의 앞부분에서 소개한 함수의 경우 , 등은 모두 독립적인 함수처럼 보입니다. 사실 이들은 모두 전역 객체의 메서드입니다. 그리고 전역 개체에는 이러한 메서드보다 더 많은 메서드가 있습니다.

encodeURI()encodeURIComponent() 메서드는 브라우저에 전달되는 URI(Uniform Resource Identifier)를 인코딩하는 데 사용됩니다. 유효한 URI에는 공백과 같은 특정 문자가 포함될 수 없습니다. 이 두 가지 방법은 유효하지 않은 모든 문자가 특수한 UTF-8 인코딩으로 대체되어 브라우저가 계속해서 이를 받아들이고 이해할 수 있도록 URI를 인코딩하는 데 사용됩니다.

encodeURI() 메소드는 전체 URI(예: http://www.php.cn/value.htm)를 처리하는 데 사용됩니다. encodeURIComponent()는 URI 조각(예: 이전 URI의 illegal value.htm)을 처리하는 데 사용됩니다. 이 두 메서드의 주요 차이점은 encodeURI() 메서드는 URI에서 콜론, 슬래시, 물음표, 파운드 기호와 같은 특수 문자를 인코딩하지 않는 반면, encodeURIComponent()는 은 발견된 비표준 문자를 인코딩합니다. 예:

이 코드는 두 가지 값을 출력합니다.

OK As 보시다시피, 로 대체된 공백을 제외하고 첫 번째 URI에는 변경 사항이 없습니다. 두 번째 URI의 모든 영숫자가 아닌 문자는 해당 인코딩으로 대체되어 본질적으로 이 URI를 쓸모 없게 만듭니다. 이것이 encodeURI()가 완전한 URI를 처리할 수 있는 반면, encodeURIComponent()는 기존 URI 끝에 추가된 문자열만 처리할 수 있는 이유입니다.

인코딩된 URI를 디코딩하는 방법에는 당연히 decodeURI()decodeURIComponent()라는 두 가지 방법이 있습니다. 예상할 수 있듯이 이 두 가지 방법은 해당 방법과 정반대의 작업을 수행합니다. decodeURI() 메서드는 encodeURI() 메서드로 대체된 문자만 디코딩합니다. 예를 들어 %20은 공백으로 바뀌지만 %23은 파운드 기호( #), encodeURI()는 이 기호를 대체하지 않습니다. 마찬가지로 decodeURIComponent()는 모든 encodeURIComponent()인코딩된 문자를 디코딩합니다. 즉, 모든 특수 값을 디코딩한다는 의미입니다. 예:

이 코드는 두 개의 값을 출력합니다.

이 예에서 변수 uri encodeURIComponent()로 인코딩된 문자열을 저장합니다. 결과 값은 두 디코딩 방법을 모두 적용했을 때 어떤 일이 발생하는지 보여줍니다. 첫 번째 값은 decodeURI()에 의해 출력되며 을 공백으로 바꿉니다. 두 번째 값은 decodeURIComponent()에 의해 출력되어 모든 특수 값을 대체합니다.

마지막 메서드는 아마도 전체 ECMAScript 언어에서 가장 강력한 메서드인 eval() 메서드일 것입니다. 이 메서드는 실행될 ECMAScript(또는 JavaScript) 문자열인 하나의 매개 변수를 허용하는 전체 ECMAScript 인터프리터와 같습니다. 예:

이 코드 줄의 기능은 다음 코드와 동일합니다.

통역사가 eval() 호출을 찾으면 인수를 실제 ECMAScript 문으로 해석하고 함수가 있는 위치에 삽입합니다. 이는 eval() 호출 내에서 참조되는 변수가 매개변수 외부에서 정의될 수 있음을 의미합니다.

여기서 변수 msg is eval()은 호출 환경 외부에서 정의되고 경고에는 여전히 "hello world"라는 텍스트가 표시됩니다. 코드의 두 번째 줄이 실제 코드 줄로 대체되기 때문입니다. . 마찬가지로 eval() 호출 내에서 함수나 변수를 정의한 다음 함수 외부의 코드에서 이를 참조할 수 있습니다.

여기서 함수 sayHi()eval() 호출 내부에 정의됩니다. 호출이 실제 함수로 대체되기 때문에 sayHi()는 다음 줄에서도 계속 호출될 수 있습니다.

전역객체에는 메서드뿐만 아니라 속성도 있습니다. 정의되지 않음, NaNInfinity라는 특수 값을 기억하시나요? 이 값들은 모두 Global 개체의 속성입니다. 또한 모든 로컬 개체의 생성자는 전역 개체의 속성이기도 합니다.

10;

open(URL,WindowName,parameterList): open 메소드는 새 브라우저 창을 만들고 새 창에 지정된 URL 주소를 로드합니다.
close(): close 메소드는 브라우저 창을 닫습니다.
alert(text): 정보 상자를 표시합니다.
confirm(text): 확인 상자를 표시합니다.
prompt(text, Defaulttext) : 프롬프트 상자를 띄웁니다.
setTimeout(expression, time): 타이밍 설정, 특정 시간 이후 자동으로 표현식에 설명된 코드를 실행합니다. 시간을 사용하여 시간을 설정합니다.
clearTimeout. (타이머): 이전 타이밍 설정을 취소합니다.
back(): 기록에서 이전 URL 주소를 로드하도록 브라우저에 지시합니다.
forward(): 기록에서 다음 URL 주소를 로드하도록 브라우저에 지시합니다.
stop( ): 브라우저에 웹 페이지 로딩을 중지하도록 지시합니다.
location: 현재 창의 URL 정보 제공

(expression, time): 타이밍 설정 , 일정 시간이 지나면 자동으로 표현식 설명을 실행합니다. 코드는 시간을 사용하여 시간을 설정하며 단위는 밀리초입니다.>

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿