JavaScript_javascript 기술에서 Function 함수와 Object 개체 간의 관계

함수는 JavaScript에서 가장 일반적으로 사용되는 개념입니다. JavaScript에서 함수는 시작하기 가장 쉬운 함수이지만 JavaScript에서 가장 이해하고 마스터하기 어려운 개념이기도 합니다.

오늘은 함수와 객체의 관계를 헷갈려 하시는 분들도 계시겠지만, 저도 예외는 아닙니다.

참고: 공식 정의: Javascript에서 모든 함수는 실제로 함수 개체입니다.

가장 이해하기 쉬운 가장 간단한 두 가지 코드를 먼저 살펴보겠습니다.

function fn(){}
var obj = {}
console.log(fn instanceof Function)//true
console.log(obj instanceof Object)//true
console.log(fn instanceof Object)//true
console.log(obj instanceof Function)//false

처음 두 가지 인쇄 효과는 누구나 쉽게 이해할 수 있습니다. 다음 fn 인스턴스는 함수 정의에서도 마찬가지입니다. 따라서 JavaScript에서는 모든 함수가 사실입니다. , 이상하지 않습니다. obj instanceof 함수는 false입니다. 물론 함수가 아니라 객체이기 때문에 이상하지 않습니다.

다른 코드를 살펴보겠습니다

console.log(Function instanceof Object); // true
console.log(Object instanceof Function); // true

코드는 매우 간단합니다. 두 가지 실행 구조 모두 참입니다. 첫 번째는 함수 정의를 사용하는 이유는 무엇입니까? (JavaScript의 함수는 실제로 함수 개체입니다.) 물론 그렇습니다. 두 번째는? 객체도 함수인가요?

객체도 함수입니다. 객체의 구조가 함수 Object(){네이티브 코드}이기 때문입니다.

이 형식에서는 선언된 Object 함수라는 것이 매우 분명하며 이는 당연히 함수이므로 둘 다 사실입니다.

두 가지 함수와 객체의 구현 코드는 물론 다릅니다. 어떻게 구현되는지 자세히 연구하지 않으니 브라우저에 대한 관련 지식을 이해하시면 됩니다.

ps: $(function(){}) 및 $(document).ready(function(){})

document.ready와 onload의 차이점 - JavaScript 문서 로딩 완료 이벤트

페이지가 로드되면 두 가지 이벤트가 발생합니다

첫 번째가 준비되었습니다. 이는 문서 구조가 로드되었음을 의미합니다(이미지와 같은 텍스트가 아닌 미디어 파일 제외)

두 번째는 onload로, 이미지와 기타 파일을 포함한 페이지의 모든 요소가 로드되었음을 나타냅니다.

jQ를 사용하는 많은 사람들은 다음과 같이 스크립트를 작성하기 시작합니다.

$(function(){
// do something
});

사실 이는 jq Ready()의 약어이며 다음과 같습니다.

이것은 Dom Ready인 jq Ready()의 메소드입니다. 그 기능 또는 의미는 DOM이 로드된 후에 DOM을 조작할 수 있다는 것입니다.

$(document).ready(function(){
//do something
})
//或者下面这个方法，jQuer的默认参数是：“document”；
$().ready(function(){
//do something
})

일반적으로 페이지가 먼저 로드에 응답하는 순서는 도메인 이름 확인 - html 로드 - js 및 css 로드 - 이미지 및 기타 정보 로드입니다.

그러면 Dom Ready가 "js 및 css 로드"와 "이미지 및 기타 정보 로드" 사이에 있어야 Dom을 작동할 수 있습니다.

1.window.onload 방식

⑴실행 시기:

웹페이지의 모든 요소(요소와 관련된 모든 파일 포함)가 브라우저에 완전히 로드된 후에 실행됩니다. 즉, 이때 JavaScript는 웹페이지의 모든 요소에 액세스할 수 있습니다.

⑵다양한 용도:

window.onload=function(){ $(window).load(function(){
//编写代码 等价于 //编写代码
} });

JavaScript의 onload 이벤트는 한 번에 하나의 함수에 대한 참조만 저장할 수 있으며 자동으로 이전 함수를 마지막 함수로 덮어씁니다.

function one()
{ alert("one");
} 
function two()
{ alert("two"); 
}
window.onload=one; 
window.onload=two; //运行代码后只有 two 

2.$(document).ready() 메소드

⑴ 실행 시점 : DOM이 완전히 준비되었을 때 호출할 수 있습니다. (이러한 요소와 관련된 파일이 다운로드되었다는 의미는 아닙니다.)

예: $(document).ready() 메서드는 DOM이 준비되었음을 알고 모든 이미지가 다운로드될 때까지 기다릴 필요가 없을 때 작동할 수 있습니다.

⑵다양한 용도: