> 웹 프론트엔드 > 프런트엔드 Q&A > 자바스크립트 함수를 작성하는 방법은 무엇입니까?

자바스크립트 함수를 작성하는 방법은 무엇입니까?

青灯夜游
풀어 주다: 2023-01-04 09:36:10
원래의
2584명이 탐색했습니다.

함수 작성 방법: 1. "함수 함수 이름(){}"; 2. "var 함수 이름 = function(){}"; "(function(){...})()"; 4. " (함수(){…}())"; 5. "$(함수(){})".

자바스크립트 함수를 작성하는 방법은 무엇입니까?

이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

다른 프로그래밍 언어에 비해 Javascript는 더 캐주얼하기 때문에 Javascript 코드에는 때때로 안개 속에 나타나는 온갖 이상한 쓰기 방법이 가득합니다. 이 기사에서는 JavaScript 함수를 작성하는 방법에 대해 설명합니다.

Javascript에는 객체만 있습니다. 변수도 객체이고, 함수도 객체입니다. 객체가 무엇인지 아는 한, 사용되는 방식대로 사용하십시오.

Javascript는 약한 유형, 개체, 인스턴스, 함수 및 메서드에 보편적입니다. 구별이 그렇게 명확할 필요는 없습니다.

1. 기존 글쓰기:

// 函数的定义
function foo() {
    alert('常规写法');
}
// 函数的调用
foo()
로그인 후 복사

이 글은 가장 친숙하고 이해하기 쉬운 쓰기 및 호출 방법입니다. 그럼 읽어보세요

2. 익명 함수 쓰기

// 函数的定义
var foo = function(){
    alert('匿名函数定义');
}
// 函数的调用
foo()
로그인 후 복사

함수 정의는 익명으로 지정되어 동시에 변수에 할당되고 변수는 함수의 동의어가 됩니다. 다음으로 메서드를 객체로 사용하기

를 참조하세요.

// 定义
var test = {
    fun1: function(){  },
    fun2: function(){  }
}
// 调用
test.fun1();
test.fun2();
로그인 후 복사
Javascript의 변수는 매우 강력하며 많은 것을 나타낼 수 있습니다.

4. 생성자에서 객체에 메소드를 추가하세요

// 给对象添加方法
var fun = function(){ };  // 定义函数对象
fun.prototype.test = function(){ 
    alert('这是在在foo函数上的原始对象上添加test方法,构造函数中用到');
}

// 调用
var myfun = new fun(); // 创建对象
myfun.test(); // 调用对象属性
로그인 후 복사
prototype 키워드를 통해 메소드를 추가하세요.

5. 자체 실행 함수( function(){…} )() 및 ( function(){…} () )

앞서 언급한 함수 정의는 호출 시간과 별개입니다. 여기서 즉시 논의하고 함께 실행합니다. ( function(){…} )() 및 ( function(){…} () )은 함수를 즉시 실행하는 JavaScript 함수를 작성하는 두 가지 일반적인 방법입니다. 처음에는 괄호로 묶인 익명 함수인 줄 알았습니다. 그리고 마지막에 괄호를 추가했는데, 결국 함수를 정의한 직후에 실행한다는 목적을 달성하게 되었는데, 나중에 괄호를 추가한 이유가 사실이 아닌 것으로 밝혀졌습니다. 함수의 즉각적인 실행을 이해하려면 먼저 함수의 몇 가지 기본 개념을 이해해야 합니다.

함수 선언, 함수 표현식, 익명 함수

함수 선언: function fnName () {…} function 키워드를 사용하여 함수를 선언한 다음

함수 선언

이라는 함수 이름을 지정합니다. Function 표현식 var fnName = function () {...}; 함수를 선언하려면 function 키워드를 사용하세요. 하지만 함수에 이름을 지정하지 마세요. 마지막으로 익명 함수가

Function이라는 변수에 할당됩니다. 표현식

, 가장 일반적인 함수 표현식 구문 형식입니다. 익명 함수: function() {}; 함수를 선언할 때 function 키워드를 사용하지만 함수에 이름을 지정하지 않으므로 익명 함수라고 합니다. 익명 함수는 함수 표현식에 속합니다. 함수 변수에 할당되면 함수가 생성되고, 이벤트에 할당되면 이벤트 핸들러가 되거나 클로저가 생성됩니다.

함수 선언과 함수 표현식의 차이점은 1. 자바스크립트 엔진이 자바스크립트 코드를 파싱할 때 현재 실행 환경(범위)에서 함수 선언을 '함수 선언 호이스팅'하는 반면, 함수 표현식은 Javascirtp 엔진은 실행된 라인에 도달할 때까지 기다려야 하며, 그런 다음 함수 표현식을 위에서 아래로 한 줄씩 구문 분석합니다.

2. 함수 선언 뒤에 괄호를 추가하면 함수 선언이 즉시 수행됩니다. 불가능하며, fnName() 형식으로만 Called를 사용할 수 있습니다. 다음은 차이점에 대한 두 가지 예입니다.

// 方式1: ( function(){…} () )
(
     function(){alert('hello world, I am coming');}()
);
// 函数有参数的情况,有时为确保执行,前面加;
// 看到别人的插件,你会发现人家开头处加了一个";",这样就算页面js有错误,加载运行他的插件也能保证运行,如:
;(function(e){alert(e);}('hello world'));

// 方式2:( function(){…} )()
(function(){alert('hello');})();

// 有时在前面加运算符,常见的是!与void
!function(){alert('hello');}();
void function(){alert(2);}();
로그인 후 복사

6 $(function(){})

$ (function(){/<em>…</em>/})을 작성하는 방법;$ (document).ready(function(){/<em>…</em>/})의 약어는 DOM이 로드된 후 실행되는 콜백 함수로, 한 번만 실행됩니다. .

$( document ).ready(function() {
   console.log( "ready!" );
});
로그인 후 복사
는 다음 작성 방법과 동일합니다.

$(function() {
   console.log( "ready!" );
});
로그인 후 복사

$(function(){/<em>…</em>/}); 한 페이지에 다른 js로 작성된 함수는 다음에서 실행됩니다. js의 순서에 따른 순서입니다. $ (function(){/<em>…</em>/});$(document).ready(function(){/<em>…</em>/})的简写形式,是在DOM加载完成后执行的回调函数,并且只会执行一次。

rrreee

与如下写法等价

rrreee

在一个页面中不同的js中写的$(function(){/<em>…</em>/});

【추천 학습:

javascript 고급 튜토리얼

위 내용은 자바스크립트 함수를 작성하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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