cách tạo thư viện javascript của các hàm tự viết

Tôi đã viết một loạt hàm javascript trong tệp html giữa các thẻ nhưng bây giờ tôi muốn tất cả các hàm của mình trong một tệp JS riêng biệt để tôi có thể sử dụng lại tệp JS cho các trang html khác để tôi chỉ cần bao gồm tệp JS.cách tạo thư viện javascript của các hàm tự viết

đây là cách các chức năng của tôi trông giống như:

function makeStartRefresher(refresh, refreshTime) { 
//function code 
} 
function readData(address){ 
//function code 
} 
function writeData(address, value, refreshCallback){.... 
........ 
........ 
........

Đây là những văn bản trên chức năng document.ready của tôi, từ đó tôi gọi và sử dụng các chức năng này.

Nó sẽ hoạt động nếu tôi chỉ sao chép các chức năng này vào tệp JS và bao gồm tệp JS trong tài liệu html của tôi, tôi có thể gọi các chức năng như bình thường không?

Grtz

Nguồn

2013-04-29 Stijn De Schutter

Bạn có nghĩ rằng phải mất nhiều thời gian để thực hiện một thử nghiệm như vậy? – Pino

Tại sao bạn không thử? –

http://www.learningjquery.com/2006/09/introducing-document-ready – TheLegend

Chỉ cần sao chép chức năng JS của bạn vào một tập tin .js và bao gồm nó như thế này trong phần <head> của tài liệu HTML của bạn:

<script type="text/javascript" src="mylibrary.js"></script>

Tài liệu này. sự kiện sẵn sàng sẽ không được kích hoạt trước khi tất cả các tập lệnh được liên kết theo cách đó được tải và thực thi, vì vậy tất cả các hàm được định nghĩa trong nó sẽ có sẵn khi nó xảy ra.

Để tránh tình trạng này với các thư viện khác, bạn có thể tùy chọn đặt tất cả các chức năng của bạn vào một đối tượng toàn cục, phục vụ như một vùng tên.

// mylibrary.js 
var myLibrary = { 

    makeStartRefresher: function(refresh, refreshTime) { 
    //function code 
    }, 
    readData: function(address){ 
    //function code 
    } 
    ... 
}

và sau đó khi bạn sử dụng chức năng từ thư viện của bạn, hãy tham khảo họ như thế này:

myLibrary.makeStartRefresher(refresher, 1000);

Nguồn

2013-04-29 13:22:47 Philipp

Tại sao lại là downvote? Chính xác. – h2ooooooo

BTW, các yếu tố kịch bản có thể được khá nhiều bất cứ nơi nào, họ không phải ở trong đầu mặc dù đó là một nơi phổ biến để đặt chúng để đảm bảo các kịch bản có sẵn trước khi trang tương tác. – RobG

Ồ, lưu ý rằng đã có thư viện javascript [myLibrary] (http://www.cinsoft.net/mylib.html). – RobG

Thông thường tôi sử dụng một cái gì đó như thế này để xác định mô-đun riêng biệt.

LibName= window.LibName || {}; 

LibName = function() { 

    var yourVar1; 
    var yourVar2; 


    publicFunc1 = function() { 

    }; 

    privateFunc2 = function() { 

    }; 


    return { 
    "publicFuncName" : publicFunc1 
    } 

}();

Trong HTML nó có thể được gọi như LibName.publicFuncName()

Ngoài ra, nhìn vào Mô-đun Pattern ở đây - http://addyosmani.com/resources/essentialjsdesignpatterns/book/

UPD:

Bây giờ ES6 khá sẵn sàng cho sản xuất và câu trả lời phải được cập nhật:

class MyLib { 
    constructor() { 
    this.foo = 1; 
    this.bar = 2; 
    } 

    myPublicMethod1() { 
    return this.foo; 
    } 

    myPublicMethod2(foo) { 
    return foo + this.bar; 
    } 
} 

const instance = new MyLib(); 
export { instance as MyLib };

Và khi bạn cần nó:

import { MyLib } from './MyLib';

Nguồn

2013-04-29 13:16:36

LibName = window.LibName || {}; // Câu hỏi này hoàn toàn điên rồ, nhưng tôi muốn hỏi. điều này có nghĩa là sử dụng đối tượng nếu có hoặc tạo một cá thể mới nếu một cá thể không hiện diện đúng không? – Vignesh

vâng, dự đoán của bạn là đúng –

cách tạo thư viện javascript của các hàm tự viết

Trả lời

Các vấn đề liên quan