JavaScript 학습 지식 포인트에 대한 간략한 요약

VUE3.0을 빠르게 시작하는 방법:

관련 권장 사항을 입력하고 알아보십시오: JavaScript 튜토리얼

1, JavaScript에 대한 간단한 소개

클라이언트 브라우저에서 실행되는

클라이언트 측 스크립팅 언어

모든 브라우저에는 JavaScript 구문 분석 엔진 스크립트 언어가 있습니다. 이는 컴파일할 필요가 없으며 브라우저에서 직접 구문 분석하고 실행할 수 있습니다. 이는 사용자와 HTML 페이지 간의 상호 작용 프로세스를 향상시키고 HTML 요소를 제어하며 페이지를 동적으로 만들 수 있습니다. 효과 및 사용자 경험 향상

1.2 JavaScript 개발의 역사

1992년 Nombase는 특별히 양식 검증에 사용되는 최초의 클라이언트측 스크립트 언어를 개발했습니다. 이름: C--, 나중에 이름 변경: ScriptEase
1995년에 Netscape는 클라이언트측 스크립팅 언어인 LiveScript를 개발했습니다. 나중에 SUN의 전문가가 초대되어 LiveScript를 수정하고 이름을 JavaScript로 지정했습니다.
1996년에 Microsoft는 JavaScript를 복사하여 JScript 언어를 개발했습니다.
1997년에 ECMA(유럽 컴퓨터 제조업체 협회)는 클라이언트측 스크립팅 언어에 대한 표준인 ECMAScript를 공식화했습니다. 이는 모든 클라이언트측 스크립팅 언어의 인코딩 방법을 통합합니다.

JavaScript = ECMAScript + JavaScript 고유의 것(BOM+DOM)

1.3. JavaScript의 장점

a.
b. 객체 기반
c.이벤트 중심
d.약한 유형
전자. 높은 안전성
f. 크로스 플랫폼

1.4 JavaScript 참조

HTML 페이지에 JavaScript를 삽입해야 하는 경우 <script> 태그를 사용하십시오.
<script> 和</script> JavaScript의 시작 위치와 끝 위치를 알려줍니다.
<script> 和</script> 사이의 코드 줄에는 JavaScript

<script type="text/javascript" src="${request.contextPath}/static/js/homepage.js"></script>가

. 1.5. JavaScript 출력 방법

window.alert()document.write()innerHTML
console.log()

프로그래밍에서는 console.log() 사용하는 것이 더 편리합니다. F12 콘솔을 통해 출력 내용을 직접 볼 수 있습니다.

1.6 JavaScript의 키워드는 무엇입니까?

1.7.JavaScript 주석

// 코드입니다: 한 문장 주석, 보통 편집기에서 ctrl + L 키입니다.
/* 코드입니다*/: 여러 줄 주석, 일반적으로 편집기의 Ctrl + Shift + L 키입니다.

1.8.JavaScript의 공통 식별자는 무엇입니까?

1.9.JavaScript의 일반적인 HTML 이벤트는 무엇입니까?

1.10. 일반적인 자바스크립트 연산자

1.11.자바스크립트의 일반적인 할당 연산자

1.12.자바스크립트의 일반적인 비교 연산자

1.13.자바스크립트의 일반적인 논리 연산자

2. JavaScript의 기본 구문을 자세히 설명합니다

. 2.1.변수

2.1.1.변수 정의

// test라는 변수를 선언합니다. var test;

var age, name, sex;//나이, 이름, 성별 변수 3개 선언

//변수 선언과 동시에 값 할당 var age = 10, name = "Xiaoqiang", sex = "1 ";

2.1.2. 변수 명명 규칙 및 사양

1. 문자, 숫자, 밑줄, 기호로 구성됩니다. 숫자로 시작할 수 없습니다.
2. 키워드는 사용할 수 없습니다. 예: while
3. 대소문자 구분 사양: 기존 작성 방법
1. 변수 이름은 의미가 있어야 합니다.
2. 카멜케이스 명명법을 준수합니다. 카멜케이스 명명법의 첫 글자는 소문자로, 다음 단어의 첫 글자는 대문자로 표시합니다. 예:

Number类型、String类型、Boolean类型、Undefined类型、Null类型、Object类型

.

Number类型、String类型、Boolean类型、Undefined类型、Null类型、Object类型

2.2.1.Number

숫자 디지털 유형: 정수 및 소수를 포함하며 다음과 같이 표현될 수 있습니다: 10진수, 8진수, 16진수,

예:

var num = 10; 
//십진수 var num1 = 012; 
//8진수 var num2 = ox123; 
//16진수

값 범위:

console.log(Number.MAX_VALUE); 
//최대값은 5e-324console.log(Number.MIN_VALUE); 
//최소값은 1.7976931348623157e+308 무한대: 무한대: -

무한대 수치 판단은 소수점을 검증하기 위해 소수점을 사용할 수 없으며 NaN(NaN----숫자가 아님)인지 검증하기 위해 NaN을 사용하지 않지만 isNaN을 사용할 수 있습니다. — 숫자의 결과가 NaN이 아닌가?
예:

var num; 
//할당되지 않은 변수 선언 console.log(isNaN(num)); 
// 숫자가 참이 아닌가요? 결과는 true입니다.

2.2.2.

문자열 문자열 이스케이프 문자:

예:

var str = "저는 오후입니다\"console.log(str); 
// iam a pm

문자열 연결:

var str1 = "Mr.";var str2 = "Hello";console.log(str1+str2); 
// 안녕하세요 선생님,

위에서 본 것처럼 문자열과 숫자를 이어붙인 결과도 문자열 이어붙이기의 효과인 경우

2.2.3.Boolean

Boolean 유형이면 두 속성이 true/false

.

2.2.4.

할당 없이 선언된 변수, 선언만 된 경우 값은 기본적으로 정의되지 않음입니다.
예:

var num;console.log(num); 
// undefine

2.2.5.Null

Null은 변수의 값이 null이 될 경우 수동으로 설정해야 한다.

2.2.6.Object

2.3 데이터 타입 변환

2.3.1

.

, Number() 어떤 값이든 숫자 값으로 변환할 수 있습니다. 변환할 문자열에 숫자 값이 아닌 문자가 있으면 NaN이 반환됩니다.
예:

var num1 = Number("10");console.log(num1); 
// 10var num2 = Number('10adbdn');console.log(num2); 
//NaNvar num3 = Number("10.78");console.log(num3); 
//10.78var num4 = Number('10.65dd');console.log(num4); 
//NaNvar num5 = Number("a10");console.log(num5); 
//NaN

(2),parseInt()는 다음과 같은 정수로 변환됩니다.

var num1 =parseInt("10");console.log(num1); 
// 10var num2 = parsInt('10adbdn');console.log(num2); 
//10var num3 =parseInt("10.78");console.log(num3); 
//10var num4 =parseInt('10.65dd');console.log(num4); 
//10var num5 =parseInt("a10");console.log(num5); 
//NaN

(3), 다음과 같이 parseFloat()를 10진수로 변환합니다.

var num1 =parseFloat("10");console.log(num1); 
// 10var num2 =parseFloat('10adbdn');console.log(num2); 
//10var num3 =parseFloat("10.78");console.log(num3); 
//10var num4 =parseFloat('10.65dd');console.log(num4); 
//10var num5 =parseFloat("a10");console.log(num5);

(4), Number(),parseInt()및parseFloat()의 차이점
Number()는 ParseInt() 및 ParseFloat()보다 엄격합니다.
parseInt()는 parseFloat()와 유사하며, 두 번째 끝 또는 숫자가 아닌 끝을 만나면 parsFloat는 첫 번째 것을 구문 분석합니다.

2.3.2 문자열 유형으로 변환합니다

(1)

예:

var num = 10;console.log(num.toString()); 
// 문자열 10

(2), 문자열()
예:

var num1 =5;console.log(String(num1)); 
// String 5

(2), JSON.stringfy()

2.3.3. Boolean 유형

0으로 변환, 빈 문자열, null, undefed, NaN은 false로 변환되고 나머지는 true로 변환됩니다.
예:

var num1 = Boolean(0);console.log(num1); 
// falsevar num2 = Boolean("");console.log(num2); 
// falsevar num3 = Boolean(null);console.log(num3); 
/ falsevar num4 = Boolean(정의되지 않음);console.log(num4); 
// falsevar num5 = 10;var num6;console.log(Boolean(num5+num6)); 
/ false

2.4. 연산자

연산자 유형: 산술 연산자, 복합 연산자, 관계 연산자, 논리 연산자

(1), 산술 연산자: "+" "-" "*" "/" "%"
산술 표현식: 산술 연산자로 연결된 표현식.

복합 연산자: "+=""-=""*=""/=""%="
복합 연산식: 복합 연산자

, 관계 연산자로 연결된 식(3): ">""<"">=""<="" "" =""!=""!== "
관계 연산 표현식: 관계 연산자

(4), 논리 연산자로 연결된 표현식: "&&" "||"

논리연산자로 연결된

식 1 && 식 2
그 중 하나라도 거짓이면 전체 결과는 거짓이다.

수식 1 ||
그 중 하나라도 true이면 전체 결과는 false입니다

. 표현식의 결과는 true이고, 전체 결과는 false입니다.
표현식의 결과는 false이고 전체 결과는 true입니다

. 2.5. 연산자의 우선순위

는 높은 것에서 낮은 것입니다:

() 우선순위가 가장 높은 단항 연산자 ++ – !
산술 연산자는 * / % 다음에 + -입니다.
관계 연산자 > >= < <=
항등 연산자 == != === !==
논리 연산자는 && 다음에 ||가 옵니다.
할당 연산자

2.6. 함수

2.6.1 소개

JavaScript의 함수는 객체입니다. 객체는 이름/값 쌍의 모음이며 프로토타입 객체에 대한 숨겨진 연결을 가지고 있습니다. 객체 리터럴에 의해 생성된 객체는 Object.prototype에 연결됩니다. 함수 개체는 Function.prototype(그 자체가 Object.prototype에 연결됨)에 연결됩니다. 각 함수는 생성될 때 두 개의 숨겨진 속성을 갖습니다: 함수의 컨텍스트와 함수의 동작을 구현하는 코드

2.6.2 함수는

function functionname()을 사용합니다. {여기에 실행될 코드가 있습니다.}

구문:
괄호에는 쉼표로 구분된 인수가 포함될 수 있습니다.

(인수1, 인수2, ...)

함수에 의해 실행되는 코드는 중괄호 안에 배치됩니다. {}

함수 이름(인수1, 인수2, 인수3) {
    실행될 코드}

함수 매개변수는 함수 정의에 나열된 이름입니다.
함수 인수는 함수가 호출될 때 함수가 받는 실제 값입니다.

함수 호출:

//여기서 함수 만들기 sumfunction sum(num1, num2) {
    var 결과 = num1 + num2;
    console.log("num1 + num2 = " + result);}// 함수 호출 sum(10, 20)

즉시 함수 실행:

$(function(){
	

모든

변수 출력 등은 페이지 로드되어 직접 실행됩니다. sum()})

2.7.JavaScript 정규식

2.7.1.

구문: Reg = /pattern/modifiers; 리터럴 규칙성은 두 개의 슬래시//로 구성되며 규칙은 첫 번째 슬래시 뒤에 작성됩니다. /pattern[규칙은 다양한 메타 문자 | 단어 세트|어설션을 작성할 수 있습니다. . 두 번째 슬래시 뒤에 식별자 /modifiers [g 전역 일치 | i 무시 | m 개행 일치 | ^ 시작 위치 $ 끝 위치] 식별자를 씁니다.
var Reg = /box/gi;
건설자. 구문 Reg = new RegExp( pattern , modifiers ); 패턴, 현재 수정자는 문자열입니다. 어떻게 생성하든 패턴 템플릿, 일치시킬 콘텐츠, 수정자는 동일합니다.

var Reg = new RegExp("box","gi");

2.7.2 String의 정규식 메소드

var

str = 'a1b2c3a4a5',
    reg = /a/g;console.log(str.match(reg)); //["a", "a", "a"]var str = 'a1b2c3a4a5',
    reg = /a/;console.log(str.search(reg)); //0var str = 'a1b2c3a4a5',
    reg = /a/g;console.log(str.replace(reg,function(){
    console.log(인수);
    5555를 반환합니다.}));var str = 'a,b,c,d',
    reg = /,/g;//console.log(str.split(',')); //["a", "b", "c", "d"]console.log(str.split( reg)) //["a", "b", "c", "d"]

2.7.3.RegExp 객체 메소드 설명

. 2.7.4 수정자

수정자는 식별자라고도 하며 일치 패턴을 지정하는 데 사용됩니다.
대소문자 일치를 무시합니다.
g는 전역적으로 일치합니다. g가 없으면 첫 번째 요소만 일치하고 일치는 수행되지 않습니다.
m은 여러 줄 일치를 수행합니다.

var patt = /pattern/i; //대소문자 일치는 무시합니다. var patt = /pattern/g; //전역 일치 var patt = /pattern/m

; 문자는

정규식에서 특별한 의미를 갖는 특수 문자입니다.
특수 번역 문자 /.

. 개행 n 및 탭 r을 제외한 단일 문자 
 이스케이프 문자, 특별한 의미가 있는 이스케이프 기호를 일반 기호로 변환: .d 숫자 [0~9]D 숫자가 아닌s 공백S 공백이 아닌w 문자 [문자|숫자|밑줄]W 비- 문자 b 단어 경계((단어) 영숫자 제외_는 모두 단어 경계임) B 비단어 경계

var reg = /./;//match.var reg = /\/;//match var reg = / //;//Match /var str = '\';var reg = /\/g;console.log(reg.test(str)) //true

2.8.1

.Date 객체

Date 객체는 날짜, 시간과 관련된 객체입니다. 이는 동적이며 다음과 같이 인스턴스를 생성하려면 new 키워드를 사용해야 합니다.
var Mydata=새 날짜();
Date 객체는 직접 액세스 속성을 제공하지 않으며 다음 표에 표시된 대로 날짜를 가져오고 설정하는 메서드만 제공합니다.

2.8.2 String 객체

String 객체는 JavaScript에서 제공하는 문자열 처리 객체로, 객체 인스턴스를 생성한 후에만 참조할 수 있으며, 문자열 처리를 위한 속성과 메소드를 제공합니다(자바와 유사).
속성 길이 - 문자열의 문자 수를 반환합니다.
참고: 한자도 문자입니다! !

2.8.3.Math 객체

속성:

수학 객체 메서드:

삼각 함수(sin(), cos(), tan(), asin(), acos(), atan(), atan2())는 값을 라디안 단위로 반환합니다. Math.PI / 180을 나누거나 다른 방법을 사용하여 라디안을 각도로 변환할 수 있습니다.

예 1: min은 포함하지만 max는 제외하여 min부터 max까지 임의의 정수를 반환하는 함수를 작성합니다.

function getRandomArbitrary(min , 최대) {
  return min + Math.random() * (max - min);}

예시 2: 길이 n의 무작위 문자열을 생성하는 함수를 작성합니다. 문자열 문자의 값 범위는 0~9, a~z, A~Z를 포함합니다.

함수 getRandomInt(최소, 최대) {
  return min + Math.floor(Math.random() * (max - min + 1));}function randomStr(n){
  var dict = '1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
  var str = '';
  for(i = 0; i < n;i++){
    str += dict[getRandomInt(0,62)];
  }
  return str;}var str = getRandStr(10);console.log(str);

배열 객체

배열

1. 2차원 배열 2차원 배열의 핵심은 배열의 요소도 배열이라는 것입니다.

a의 열 2 및 행 1.

희소

배열에는 값이 포함됩니다. 0부터 시작 배열의 시작 비연속 인덱스입니다. 희소 배열에서 길이 속성 값은 일반적으로 실제 요소 수보다 큽니다(드물게)
예

var a=["a",,"b",,,,"c",,];

배열 객체 속성

1.length 속성을

. //배열의 길이를 표시합니다. 10arr.length=15; /배열의 길이를 늘립니다. 길이 속성은 변수입니다. Alert(arr.length ); //배열의 길이가 15가 되었음을 표시합니다.

2.prototype 속성

프로토타입 속성은 객체 유형의 프로토타입에 대한 참조를 반환합니다. 프로토타입 속성은 객체에 공통됩니다.
objectName.프로토타입
objectName 매개변수는 객체 객체의 이름입니다.
설명: 프로토타입 속성을 사용하여 객체 클래스의 기본 기능 세트를 제공합니다. 객체의 새로운 인스턴스는 객체의 프로토타입에 할당된 작업을 "상속"합니다.
배열 객체의 경우 다음 예를 사용하여 프로토타입 특성의 사용을 보여줍니다.
배열의 최대 요소 값을 반환하는 배열 개체에 메서드를 추가합니다. 이를 수행하려면 함수를 선언하고 Array.prototype에 추가한 후 사용하세요.

함수 array_max( ){
   var i, max = this[0];
   for (i = 1; i < this.length; i++){
       if (최대 < this[i])
       최대 = this[i];
   }
   return max;}Array.prototype.max = array_max;var x = new Array(1, 2, 3, 4, 5, 6);var y = x.max( )

3.constructor 속성

생성자 속성은 생성된 항목을 나타냅니다

객체 기능.
object.constructor //object는 객체 또는 함수의 이름입니다.
설명: 생성자 특성은 프로토타입이 있는 모든 개체의 구성원입니다. 여기에는 Global 및 Math 개체를 제외한 모든 JScript 기본 개체가 포함됩니다. 생성자 속성은 특정 객체 인스턴스를 생성하는 함수에 대한 참조를 보유합니다.

예:

x = new String("Hi");if (x.constructor == String) // 프로세스(조건이 true). //또는 함수 MyFunc {// 함수 본문. }y = new MyFunc;if (y.constructor == MyFunc) // 프로세스(조건이 true).

배열 객체 메서드 <br/> 설명: 그 중 일부는 ECMAScript5의 새로운 기능입니다(IE678에서는 지원되지 않음).

주로 몇 가지 새로운 기능을 설명합니다

.
concat의 기능은 배열을 접합하는 것입니다. 배열 요소를 접합 요소로 사용할 수도 있습니다. 이 경우 배열은 평면화된 다음 다른 요소와 접합되어 새로운 배열을 형성합니다. 하지만 concat은 원래 배열을 수정하지 않습니다.

예:

var arr=[1,2,3,4,5];arr.concat([10,11],13);//[1,2,3,4,5,10,11,13] arr .concat([1,[2,3]]);//[1,2,3,4,5,1,[1,3]]

슬라이스
슬라이스 (a, b) a와 b는 음수를 취할 수 있습니다. 이는 배열이 a 위치에서 b 위치로 가로채는 것을 의미하며, A와 b는 음수를 취할 수 있습니다. 숫자인 경우 마지막 a/b 요소를 의미합니다.

var arr=[1,2,3,4,5];arr.slice(1,3);//[2,3]arr. 슬라이스(1);//[2,3,4, 5]arr.slice(1,-1);//[2,3,4]arr.slice(-4,-3);//[2 ]

접합
splice는 요소를 제거하고 배열에 새 요소를 추가합니다.
object.splice(a) 왼쪽에서 요소를 삭제합니다.
object.splice(a, b)는 a 위치에서 시작하여 b 요소를 가로챕니다.
object.splice(a, b, c, d)는 a 위치에서 시작하는 b 요소를 가로채고 c 및 d 이상의 요소를 원래 배열에 삽입합니다. splice는 원래 배열을 수정합니다.

var arr=[1, 2 ,3,4,5];arr.splice(2);//[3,4,5]arr;//[1,2];원래 배열이 수정되었습니다. var arr=[1,2,3 ,4 ,5];arr.splice(2,2);//[3,4]arr;//[1,2,5];var arr=[1,2,3,4,5];arr .splice (1,1,'a','b');//[2]arr;//[1,"a","b",3,4,5]

foreach
foreach() 함수는 배열을 처음부터 끝까지 순회합니다. 세 가지 매개변수가 있습니다: 배열 요소, 요소 인덱스, 배열 자체

var arr = [1, 2, 3, 4, 5] arr.forEach(function(x, index, a){//해당 항목: 배열 elements , 요소의 인덱스, 배열 자체 console.log(x + '|' + index + '|' + (a === arr));});// 1|0|true// 2| 1|참/ / 3|2|참// 4|3|참// 5|4|참

감소()
배열의 감소()는 이 배열의 [x1, x2, x3...]에 함수를 적용합니다. 이 함수는 두 개의 매개변수를 받아야 하며 결과를 계속해서 시퀀스의 다음 요소로 누적 계산을 수행합니다. is :

[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)

var arr = [1, 2, 3];var sum = arr.reduce ( 함수(x, y) {
     return x + y}, 0); //매개변수 0은 선택사항입니다. 매개변수 0을 쓰면 처음으로 전달되는 두 값은 0과 1입니다. 그렇지 않은 경우 처음 두 값은 ​​​​처음 전달된 값은 배열의 처음 두 값입니다. value, 계산 결과는 6arr //[1, 2, 3]arr = [3, 9, 6];var max = arr입니다. 감소(함수(x, y)) {
     console.log(x + "|" + y);
     return x > y ? x : y;});// 3|9// 9|6max; //

9개의 배열과 일반 객체의 비교

배열과 문자열 비교

2.9.JSON

2.9.1.stringify

()

는 js 객체를 JSON 문자열로 직렬화하는 데 사용됩니다.

={name:"xiaoming",age:12}var json=JSON.stringify(person); //{"name":"xiaoming","age":12}

객체를 허용하는 것 외에도 stringify() 수행할 수 있습니다.

의

배열 컬렉션일 수 있으며 두 번째 매개변수는

JSON 문자열에 들여쓰기된 배열 필터를 유지할지 여부를 나타내는 옵션입니다.

person,['name']); //{"name":"xiaoming"}

함수 필터:

json=JSON.stringify(person,function(key,value){
    스위치(키){
        케이스 "이름":
           반환값+",왕";
        "나이"의 경우:
           정의되지 않은 반환;
        기본:
           반환값;
    }});//{"name":"xiaoming,wang"}

함수가 정의되지 않은 경우 이 속성은 무시됩니다.

json=JSON.stringify(person,null,4)

;

    "이름": "샤오밍",
    "age": 12}

2.9.2.toJSON()

객체에 toJSON() 메서드를 추가합니다:

var person={
    이름:"샤오밍",
    나이:12,
    toJSON:함수(){
        return this.name+"는 "+this.age;
    }}json=JSON.stringify(person);console.log(json); //"xiaoming is 12"

2.9.3.parse()

json 문자열을 받아들이는 것 외에도, parse()는 함수 매개변수도 받아들일 수 있습니다. 이 함수는 키와 값이라는 2개의 값을 허용합니다.

var person=JSON.parse('{"name":"xiaoming","age":12}');var person=JSON.parse('{"name " :"xiaoming","age":12}',function(키,값){
    if(키=="나이"){
        반환값+10;
    }
    또 다른{
        반환값;
    }});

2.10.Ajax

2.10.1. 생성 단계:

1. XMLHttpRequest 비동기 객체를 생성합니다.
2. 요청방법 및 요청주소 설정
3. 그런 다음 보내기를 사용하여 요청을 보냅니다.
4. 상태 변화 모니터링
5. 마지막으로 반환된 데이터를 받습니다.

예:

const xhr = new XMLHttpRequest()xhr.open('GET', './data/test.json', true)xhr.onreadystatechange = function () {
  if (xhr.readyState === 4) {
    if (xhr.status === 200) {
      console.log(JSON.parse(xhr.responseText))
    } 또 다른 {
      console.log('다른 상황...')
    }
  }}xhr.send()

2.10.2.jQuery의 Ajax 애플리케이션

$.ajax({
                    type: "post", //요청 메소드 url: "a.php", //서버 링크 주소 dataType: "json", //데이터 송수신 형식 data:{
                        사용자 이름:"제임스",
                        비밀번호:"123456"
                    },
                    성공:함수(데이터){//데이터를 성공적으로 수신할 때 호출되는 함수 console.log(data);//데이터는 서버에서 반환한 데이터입니다},
                    error:function(request){//데이터 요청 시 호출된 함수가 실패했습니다. Alert("오류가 발생했습니다:"+request.status);
                    }});

2.10.3.GET 메소드

구조

$.get(url, [data], [callback], [type])

매개변수 설명:

//1단계: 비동기 객체 생성 var ajax = new XMLHttpRequest(); //2단계: 요청의 url 매개변수를 설정합니다. 첫 번째 매개변수는 요청 유형이고 두 번째 매개변수는 요청된 urlajax.open( "get", " users.json");//3단계: 요청 보내기 ajax.send();//4단계: onreadystatechange 이벤트 등록 상태가 변경되면 ajax.onreadystatechange = function() {
    if (ajax.readyState == 4 && ajax.status == 200) {
        //5단계: 이 판단을 입력할 수 있으면 데이터가 완벽하게 반환되었으며 요청한 페이지가 존재한다는 의미입니다. console.log(ajax.responseText) //응답 내용을 입력하세요.}}

; POST 메소드

$.get() 메소드와 구조 및 사용법은 동일하지만 여전히 몇 가지 차이점이 있습니다.

2.10.5 get과 post의 차이점

1. get 모드에서 요청하면 Post가 더 안전합니다. 요청 매개변수는 URL 뒤에 연결되므로 보안이 낮습니다. 포스트 모드에서 요청할 때 요청 매개변수는 요청 본문에 래핑되므로 더 안전합니다.
2. 양의 차이: get 방식으로 전송되는 데이터의 양은 작아서 2kb를 초과할 수 없는 반면, post 방식으로 요청하는 데이터의 양은 많아 제한이 없습니다.
3. 전송 속도: get의 전송 속도가 post의 전송 속도보다 빠릅니다.
사용법이 동일하기 때문에 jQuery 함수만 변경하면 GET 요청과 POST 요청 간 프로그램 전환이 가능합니다.

2.11.Cookie

2.11.1.js 쿠키 읽기 연산

function getCookie(c_name){ if (document.cookie .length>0){ //쿠키가 비어 있는지 먼저 확인합니다. 비어 있으면 ""를 반환합니다. c_start=document.cookie.indexOf(c_name + "=") //indexOf()를 통해 쿠키가 존재하는지 확인합니다. String 객체가 없으면 -1입니다. if (c_start!=-1){ c_start=c_start + c_name.length+1 //마지막 +1은 실제로 "=" 숫자를 나타냅니다. 쿠키 값의 시작 위치 c_end= document.cookie.indexOf(";",c_start) //사실 indexOf()의 두 번째 매개변수를 처음 봤을 때 조금 어지러웠어요. 나중에 지정된 시작 위치를 의미한다는 걸 기억했어요. 인덱스 위치...이 문장은 값 끝 위치를 가져오는 것입니다. 마지막 항목인지를 고려해야 하기 때문에 (c_end==-1) c_end=document.cookie.length이면 ";" 기호가 있는지 판단할 수 있습니다.　
return unescape(document.cookie.substring(c_start,c_end)) //substring()을 통해 값을 얻습니다. unescape()를 이해하려면 먼저 escape()가 무엇인지 알아야 합니다. 더 알고 싶다면 쿠키 인코딩에 대한 자세한 내용도 마지막에 설명하겠습니다. the article} } return "" }

2.11.2 .Cookie 단순 저장 작업

$.cookie("groupCode",222)

2.11.3.Cookie 만료 시간 설정

document.cookie = "name=value;expires=date"

2.11.4 .쿠키 수정

document.cookie = "username=zhangsan";document.cookie = "username=lisi";var cookie = document.cookie;console.log(cookies)

2.11.5.쿠키 삭제document.cookie

= "username=zhangsan" ";document.cookie = "username=; 만료=1970년 1월 1일 목요일 00:00:00 GMT";var cookie = document.cookie;console.log(cookies);

2.12. 루프

2.12.1. for 루프

for is 가장 일반적으로 사용되는 루프, 주로 배열을 루프하는 데 사용됩니다.

let arr = [1,2,3];for (let i=0; i<arr.length; i++){
 console.log(i,arr[i])}// 0 1// 1 2// 2 3

2.12.2.Array.forEach()

구문: arr.forEach(callback(currentValue [, index [, array]])[, thisArg]);

콜백은 배열의 각 요소에 대해 실행되는 함수입니다. 이 함수는 currentValue(배열에서 현재 처리 중인 요소), index(배열에서 현재 처리 중인 요소의 인덱스)라는 세 가지 매개변수를 받습니다. ), array (forEach() 메소드가 동작하는 배열)

thisArg는 콜백함수 콜백 실행시 this로 사용되는 값이다.

let arr = [1, 2, , 3]let arrCopy1 = []arr.map((item, index, arr) => {
     arrCopy1.push(item * 2)})console.log(arrCopy1)// [2, 4, 6]

forEach()는 각 배열 요소에 대해 콜백 함수를 한 번씩 실행합니다. 삭제되거나 초기화되지 않은 항목은 건너뜁니다(예: 희소 배열) )
map() 및 Reduce()와 달리 반환 값이 없으며 항상 undefind를 반환합니다.
ForEach()에는 예외를 발생시키는 것 외에는 forEach() 루프를 중단하거나 중단할 수 있는 방법이 없습니다.

2.12.3.while

while 문은 특정 조건식이 참이라는 전제 하에 해당 식이 참이 아닐 때 루프가 끝날 때까지 지정된 코드 조각을 실행하기 위해 반복할 수 있습니다.

예:

let n = 0 while (n < 3) {
  n++;}console.log(n);//예상 출력: 3참고

: 조건 평가 결과가 true가 되기 전에 break 문을 사용하여 루프를 중지합니다.

2.12.4.do…while

do…while 문은 실행되는 루프를 생성합니다. 조건 값이 false가 될 때까지 지정된 문입니다. 명령문 실행 후 조건을 감지하여 지정된 명령문이 적어도 한 번 실행되도록 합니다.

예:

const list = ['a', 'b', 'c']let i = 0do {
  console.log(list[i]) //값
  console.log(i) //인덱스
  i = i + 1} while (i < list.length)

2.12.5.for…in

for…in 루프는 객체([[Prototype]] 체인 포함)의 열거 가능한 속성 목록을 순회하는 데 사용할 수

있으며 주로 객체를 가로 지르기 위해 사용되며, 속성 값은

(객체의 속성) {를

  Console.log (속성) // 속성 이름
  Console.log (Object [Property]) // 속성 값}

관련 권장 사항 : JavaScript 학습 자습서

는 JavaScript Learning Knowledge Points에 대한 자세한 요약입니다.