> 웹 프론트엔드 > JS 튜토리얼 > 자바스크립트 함수 작성 방법

자바스크립트 함수 작성 방법

醉折花枝作酒筹
풀어 주다: 2023-01-06 11:17:28
원래의
5331명이 탐색했습니다.

Javascript 함수 작성 방법은 다음과 같습니다. 1. 기존 작성 방법인 "function function name(){js code} function name()" 2. $(function(){}) 작성 방법인 "$(object).ready (함수 () {js 코드});".

자바스크립트 함수 작성 방법

이 튜토리얼의 운영 환경: 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 키워드를 사용하여 함수를 선언한 다음 함수 이름을 지정합니다. 이를 함수 선언이라고 합니다.

함수 표현식 var fnName = function () {…}; 함수를 선언하기 위해 function 키워드를 사용하지만, 함수에 이름을 부여하지 않습니다. 마지막으로 익명 함수가 함수 표현식이라는 변수에 할당됩니다. 가장 일반적인 함수 표현.

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

함수 선언과 함수 표현식의 차이점은

1 자바스크립트 엔진이 자바스크립트 코드를 파싱할 때 현재 실행 환경(scope)에서 함수 선언을 '함수 선언 호이스팅'하고, 함수 표현식을 기다려야 합니다. Javascirtp 엔진이 해당 라인을 실행할 때까지 함수 표현식을 위에서 아래로 한 줄씩 구문 분석합니다.

2. 함수 표현식 뒤에 괄호를 추가하면 함수를 즉시 호출할 수 없습니다. fnName.() 형식 호출이라고 합니다. 다음은 차이점에 대한 두 가지 예입니다.

// 方式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(){/…/})의 작성 방법은 $(document).ready(function(){/…/ }), DOM이 로드된 후 실행되는 콜백 함수로, 한 번만 실행됩니다.
$( document ).ready(function() {
   console.log( "ready!" );
});
로그인 후 복사

는 다음 작성 방법

$(function() {
   console.log( "ready!" );
});
로그인 후 복사
$(function(){/…/})과 동일합니다. 한 페이지에 서로 다른 js로 작성된 함수는 js의 순서에 따라 순차적으로 실행됩니다.

【추천 학습:

javascript 고급 튜토리얼

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

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