Khai báo hàm Javascript. Colon trong khai báo hàm

Question

Sự khác biệt giữa khai báo hàm "hàm test()" và "test: function()" trong javascript là gì?

function test() { 

} 

vs

test: function() { 

} 

---

---

---

Trong var functionName = function() {} vs function functionName() {} chức năng câu hỏi đã được tuyên bố như:

function test() { 

} 

và

var test = function() { 

}; 

Từ chức năng phối cảnh cú pháp trong câu hỏi của tôi không giống nhau.

Answer 1

function test() là khai báo hàm bình thường mà bạn có thể gọi trực tiếp bằng tên hàm. Trong khi test: function() là hàm được định nghĩa bên trong một số đối tượng, vì vậy nó phải được gọi bằng cách sử dụng đối tượng mà trên đó nó được định nghĩa.

Ví dụ

Function Tuyên bố

function test() { 
    alert('In Test'); 
} 

test(); // Calling test 

Phương pháp

var myObj = { 
    test: function() { 
     alert('Inside test'); 
    } 
}; 

myObj.test(); // Calling test 

Answer 2

Xem xét đối tượng javascript này:

01.

{ "name" : "Joe", 
    "age" : "23"} 

Javascript bị yếu gõ, bạn có thể thay thế "23" (string) với 23 (số):

{ "name" : "Joe", 
    "age" : 23} 

Không có lỗi, hoạt động hoàn hảo.

Trên thực tế, bạn có thể thay thế 23 với bất cứ điều gì khác: một boolean

{ "name" : "Joe", 
    "age" : true} 

một đối tượng

{ "name" : "Joe", 
    "age" : {"2014" : 22 , "2015": 23 } } 

hoặc thậm chí một hàm

{ "name" : "Joe", 
    "age" : function(){ alert("23");} } 

Phụ chú: một số người ghét Javascript vì đã quá lỏng lẻo. Những người khác (như tôi) yêu thích Javascript vì lý do này, bởi vì sự linh hoạt này là sức mạnh của nó (điều đó và không đồng nhất).

Bạn có thể đặt tên cho đối tượng "người" và hỏi tên và tuổi của mình:

var person = { "name" : "Joe", 
     "age" : function(){ alert("23");} } 

console.log(person.name); // will log "Joe" 
person.age(); // "age" is a function, so you need to call it. It will alert 23. 

Bây giờ bạn có thể tạo một hàm sẽ trả lại đối tượng:

function Person() { 
    return{ 
     "name" : "Joe", 

     "age" : function(){ alert("23");}, 

     sayHello : function() { 
     alert("Hello"); 
     }, 

     sleep : function() { 
     alert("I'm sleeping"); 
     } 
    } 
}; 

console.log(Person().name); // logs "Joe" 
Person().age(); // alerts "23" 
Person().sayHello(); // alerts "Hello" 
Person().sleep(); // alerts "I'm sleeping". 

age, sayHello và sleep là các hàm, được gọi là các phương thức của hàm Person.

Một thường tránh gọi Person() nhiều lần, và tạo ra một new Person thay vì:

var person = new Person(); 
person.sayHello(); // alerts "Hello" 
person.sleep(); // alerts "I'm sleeping". 

Phương pháp này cho phép tạo ra nhiều người, bằng cách thông qua các thông số:

function Person(name, age) { 
    return{ 
     "name" : name, 

     "age" : function(){ alert(age);}, 

     sayHello : function() { // sayHello or "sayHello", both work 
      alert("Hello, my name is "+ this.name); 
     }, 

     sleep : function() { 
      alert("I'm sleeping"); 
     } 
    } 
}; 

var person = new Person("John", 25); 
person.sayHello(); // alerts "Hello, my name is John" 
person.age(); // alerts "25". 

Phương pháp này hiện đang thay thế các lớp học , Javascript 5 (EcmaScript 5) thiếu. Nhưng ECMaScript 6 sẽ sớm ra mắt, với các lớp học phù hợp.