JavaScript chết lặng

Tôi là một lập trình viên có sở thích kể từ khi tôi có chiếc máy tính đầu tiên vào năm 1984 hoặc lâu hơn. Tôi rất thích nó và tôi rất tệ về nó

Tôi chủ yếu sử dụng JS để tạo các tiện ích cho bản thân, tôi mất 1.000 giờ để viết và tiết kiệm cho tôi 45 giây trọn đời. Tôi thích Javascript vì những lý do ngớ ngẩn. Thật đơn giản, có một bộ thư viện khổng lồ, bất kỳ câu hỏi nào tôi có thể đã từng được hỏi và trả lời tại StackOverflow và tôi có thể xem kết quả ngay lập tức trên màn hình. Tất nhiên, nó cũng hữu ích cho các trang web giải đấu bụi khác nhau mà tôi thỉnh thoảng phải đưa lên (e. g. , Sự hỗn loạn hàng ngày). Ngoài ra, jQuery làm cho HTML (DOM) ngớ ngẩn hoạt động dễ dàng

Nhưng đây là nhưng…

Nhưng, ECMA đang đưa JS đi theo một hướng tồi tệ. nó đang biến nó thành chuyên nghiệp, những gì với các chức năng mũi tên và những lời hứa, v.v. Nếu bạn là một người có sở thích thích lập trình theo logic của nó, thì nội dung mới trong JS sẽ che giấu logic đó thay cho những thứ mà tôi tình cờ không quan tâm như sự thanh lịch, nhất quán và ngắn gọn

Bây giờ, tôi biết rằng tôi không phải sử dụng những thứ mới. Nhưng trên thực tế thì tôi có, vì cộng đồng mà tôi dựa vào để trả lời các câu hỏi của mình — về cơ bản là StackOverflow — đang ngày càng trả lời nhiều hơn bằng nội dung mới

Có lý do khiến JS trở thành ngôn ngữ được sử dụng nhiều nhất trên hành tinh. bạn không chỉ có thể làm những thứ trên mạng với nó, nó còn có một đường cong học tập khá tuyến tính. Bây giờ tôi thực sự cảm thấy mình có nguy cơ bị mất “Xem nguồn” khỏi trình duyệt của mình… theo đúng nghĩa đen bởi vì trong khi tôi có thể xem nguồn, tôi ngày càng không thể hiểu được nó

Tôi sẽ thua cuộc tranh luận này. tôi đã mất nó rồi. tôi nên mất nó. vị trí của tôi là sai. tôi biết điều đó. Tuy nhiên, tôi kiên quyết đứng về phía sai lầm của lịch sử khi tôi tuyên bố bằng giọng nói cô đơn, run rẩy của mình. Giữ. JavaScript. Câm

Anh ấy vẫn không biết mình muốn trở thành gì khi lớn lên, vì vậy anh ấy cố gắng tiếp thu nhiều nhất có thể. Được truyền cảm hứng từ những người anh ấy gặp trong kỳ thực tập mùa hè với Silicon Prairie News, anh ấy đang tự học viết mã—chia sẻ một số bài đăng của anh ấy trong quá trình thực tập qua SPN. Thật khó, nhưng ít nhất đứa trẻ đang cố gắng.  

Bài đăng này ban đầu xuất hiện trên blog cá nhân của Frank, “Idiot Learns to Code” và đã được xuất bản lại ở đây với sự cho phép của anh ấy


(TUYÊN BỐ MIỄN TRỪ TRÁCH NHIỆM. Tôi chắc chắn rằng tôi sẽ mắc nhiều lỗi khi mô tả khoa học máy tính cơ bản và thuật ngữ dành riêng cho mã. Đó là phần "thằng ngốc" đi qua. Tất cả điều này được viết bằng ngôn ngữ của sự hiểu biết của tôi. Tôi hy vọng nó cũng là của bạn. Tôi thích nó khi mọi người sửa lỗi cho tôi trong các nhận xét hoặc qua phương tiện truyền thông xã hội. Lấy tất cả những gì bạn đọc ở đây bằng một hạt muối có kích thước bằng một tiểu hành tinh có kích thước bằng Texas, tất nhiên là 268.820 dặm vuông. )

Một bài đăng danh sách. HOAN HÔ

Chỉ là vấn đề thời gian trước khi tôi tạo ra một số clickbait lỗi thời

Hãy để tôi bắt đầu bằng cách nói rằng tôi yêu Codecademy. Tôi không thể đạt được trình độ như bây giờ nếu không có khóa học Javascript cơ bản của họ. Nhưng như bất kỳ nhà phát triển web giỏi nào cũng sẽ nói với bạn, cách tốt nhất để học là thực sự xây dựng một thứ gì đó.

Tôi đang đến đó, chậm mà chắc. Khuyến nghị lớn nhất của tôi dành cho người dùng Codecademy là sử dụng nó như một điểm khởi đầu; . Đối với tôi, đó là Javascript. Vì vậy, không cần phải chần chừ thêm nữa, những điều quan trọng nhất mà tôi đã học được về JS sau Codecademy

1. Cấu trúc DOM

Về mặt lý thuyết, nếu bạn đang tự học Javascript, bạn đã biết một chút về HTML và CSS. Tôi luôn cảm thấy rằng các nhà phát triển mới bắt đầu phải học HTML trước tiên—khối xây dựng của Internet—sau đó là CSS tạo kiểu dáng cho HTML, sau đó là Javascript, thứ xử lý dữ liệu và quy định cách các đối tượng CSS và HTML hoạt hình hoặc tương tác phía máy khách

Vì vậy, sau khi tôi hoàn thành khóa học JS của Codecademy, tôi muốn biết nó thực sự hoạt động như thế nào trong trình duyệt. Nhưng không có gì trong phần giới thiệu JS của Codecademy cho bạn biết cách triển khai Javascript trong trang web của bạn. Lệnh chuyển đến “in” trong các bài học của họ là “bảng điều khiển. log()”, nó chỉ làm được điều đó. Đăng nhập vào bảng điều khiển, nơi diễn ra quá trình xem trước của Codecademy. Về mặt thực tế, điều này hoạt động, nhưng không phải về mặt chức năng. Việc hiển thị thực tế văn bản và đầu ra dữ liệu khác trên các trang web được thực hiện bằng HTML, được thao tác bởi Javascript

Nhập DOM hoặc Mô hình đối tượng tài liệu. Đó là một quy ước chỉ định cách các tài liệu web được truy cập và sửa đổi (thường là với JS). Hãy nghĩ về nó như một hệ thống phân cấp nơi các phần tử HTML được truy cập theo thứ tự chúng được sắp xếp và lồng vào nhau

JavaScript chết lặng
JavaScript chết lặng

Đồ họa này (từ W3C) hiển thị một phần của “Cây DOM. ” Nếu bạn đã từng sử dụng chức năng “Kiểm tra phần tử” trong trình duyệt của mình, thì có lẽ bạn đã thấy một chức năng JS có tên là “tài liệu. getElementById(). ” Đây có lẽ là chức năng quan trọng nhất cho người mới bắt đầu Javascript. Nó định hướng cho các chức năng để chúng nhận dữ liệu và/hoặc đầu vào hợp lệ, di chuyển xuống các nhánh của cây DOM để lấy thông tin

So, you write some Javascript in the of your HTML document (another convention you ought to be aware of). Here’s a stupidly easy example of Javascript working with HTML:

JavaScript chết lặng
JavaScript chết lặng

Vì vậy, đây là những gì tôi đã làm về những thứ mà Codecademy không dạy

  • Put some Javascript in our HTML page with the , it returns to processing the HTML with respect.
  • In this case, we’ve got a simple function called “greeting()” that outputs “hello” when you click a button. How do we get there? DOM scripting, of course! That little built-in function, “document.getElementById(“output”)” tells the browser to scan the HTML document for an ID called “output” contained in a
    tag. We’re first accessing, then manipulating the DOM.
  • As the browser interprets the page, it interprets our button element which contains instructions to execute our “greeting()” function at “onclick”. When that happens, it triggers the function to access our
    and do…something. We use another simple function, “.innerHTML”, to display the text “hello!”. Through the DOM, we’re accessing the
    and altering its HTML content through Javascript, taking empty space and putting a greeting tied to the user’s input of clicking a button. Here’s what it looks like:

JavaScript chết lặng
JavaScript chết lặng

Vì vậy, trong rất nhiều từ, đó là cách để Javascript hoạt động trên trang và bên ngoài IDE của Codecademy. Không chỉ vậy, bạn còn có thể thấy giá trị của js để xử lý đầu vào của người dùng

2. JSON

Không, JSON không phải là cách đánh vần kỳ lạ của ban nhạc ngu ngốc của một số alt-dude. JSON là viết tắt của JavaScript Object Notation, một định dạng dữ liệu độc lập với ngôn ngữ được rất nhiều API sử dụng. Nó tuân theo phương pháp cơ bản về cách các đối tượng được ký hiệu trong Javascript. (Có lẽ đó là lý do tại sao họ gọi nó là Javascript Object Notation. Khéo léo. )

Một ví dụ

{Tên. “Frank”, Sandwich yêu thích. “Quá nhiều cá ngừ” }

 

Đủ đơn giản, nhưng các trang web có thể xây dựng cơ sở dữ liệu khổng lồ bằng công cụ đơn giản này. Lần đầu tiên tôi gặp JSON là khi tôi có một sơ đồ dựng tóc gáy để xây dựng một tiện ích cho Discogs, một cơ sở dữ liệu trực tuyến cho phép những người nghiện đĩa nhựa và những người sưu tầm nhạc thuộc bất kỳ phương tiện vật lý nào tạo danh mục kỹ thuật số cho các bộ sưu tập của họ. API của họ dựa trên JSON, vì vậy bạn có thể truy cập các đối tượng dành cho nghệ sĩ, bản phát hành, bản phát hành chính, danh sách theo dõi, kiểu tóc rawk(?) và vô cực. Một công cụ hữu ích cho ai đó muốn mở rộng bộ sưu tập của họ hoặc chia sẻ nó với bạn bè, gia đình và những nhà sưu tập ghen tị. Nhưng tôi lạc đề

JSON không được đề cập trong khóa học Javascript của Codecademy, nhưng có thể được tham chiếu trong một số hướng dẫn về API mà tôi chưa duyệt qua. Nhưng vì thuộc tính mạnh nhất của Javascript là khả năng truy cập dữ liệu và chuyển đổi nó thành định dạng HTML có thể sử dụng được, nên bạn có thể muốn dành thời gian để tìm hiểu thêm một chút về cách JSON hoạt động trong thế giới thực. Thế giới thực là Internet

3. AJAX

JavaScript chết lặng
JavaScript chết lặng
AJAX là một từ viết tắt thú vị khác nghe có vẻ đáng sợ hơn thực tế. Javascript và XML không đồng bộ (XML là phương thức lưu trữ dữ liệu dựa trên tập lệnh). Với I/O không đồng bộ, các ứng dụng web có thể hoạt động mà không cần phải liên tục làm mới trang. Ví dụ, khi tôi nghe 89. 3 Luồng web của Hiện tại (giống như tôi là một hipster giỏi), họ có AJAX được tích hợp vào công cụ web cho phép luồng tiếp tục phát trong khi thay đổi thông tin mà nó hiển thị, chẳng hạn như bản nhạc hiện tại và ảnh bìa album. Tài liệu XML nhận thông tin theo thời gian thực về bài hát đang phát sóng, tên nghệ sĩ, v.v. Trong khi đó, Javascript có hướng dẫn về thời điểm truy cập tài liệu XML và cập nhật trang cho phù hợp—mà không làm thay đổi menu điều hướng ở phía bên tay phải (hình bên trái).  

Thành thật mà nói, tôi chưa dành nhiều thời gian làm việc với AJAX hoặc cú pháp của nó (bạn đã xem chương trình ví dụ của tôi…), nhưng điều quan trọng là phải biết rằng AJAX tồn tại khi bạn bắt đầu xây dựng các ứng dụng phức tạp hơn. Dữ liệu không thú vị sao?

4. Nút. js và các nhánh JS khác

Theo cách giải thích ngớ ngẩn nhất có thể, Node. js là một cổng tích hợp C cho phép Javascript chạy dưới dạng ngôn ngữ phía máy chủ

Nói gì cơ?

Nút có thể thực hiện các yêu cầu máy chủ và hướng đến sự kiện. Tôi sẽ đến các sự kiện trong bản tóm tắt Dum-Dum tiếp theo của tôi về các thuật ngữ khoa học máy tính

Hiện tại, đừng mong đợi thực sự hiểu Node là gì trước khi bạn hiểu rõ về Javascript và ngôn ngữ phụ trợ làm gì. tôi chắc chắn không. Bài học quan trọng nhất để lượm lặt từ Node. js là ngôn ngữ Javascript năng động như thế nào. Nó liên tục trong tình trạng phân nhánh và phát triển. Đó là điều khiến tôi suy nghĩ khi bắt đầu học cách viết mã; . Node vẫn còn ở giai đoạn sơ khai, nhưng các nhà phát triển dường như rất hào hứng với tiềm năng của nó và thật tốt khi bạn luôn theo dõi sự phát triển của nhà phát triển khi họ phát triển

uh-huh

Đối với các chi nhánh khác, hãy xem CoffeeScript, Dart và. Hoặc không - tôi không phải là bố của bạn

5. jQuery

Tôi biết, tôi biết, Codecademy có một chương dành riêng cho jQuery. Đó là lý do tại sao tôi có nó ở mục cuối cùng trong danh sách—họ không tích hợp nó vào chương Javascript. Tôi muốn có nó như một phần của tài liệu khóa học Javascript khi xem xét có bao nhiêu thứ thú vị mà mọi người muốn làm với JS được xử lý bởi jQuery. Điều đó bao gồm văn bản động trên các sự kiện như di chuột qua, hiển thị và ẩn div, v.v.

jQuery là một thư viện Javascript “viết ít hơn, làm nhiều hơn”. Tôi nghĩ về nó (có lẽ không chính xác?) Có mối quan hệ tương tự với HTML và CSS. CSS tạo kiểu HTML bằng cách sử dụng các phần tử và hướng dẫn tích hợp sẵn, còn jQuery sử dụng các phương thức Javascript để hướng dẫn chức năng JS;

Codecademy cũng có phần giới thiệu khá hay về jQuery, nhưng cũng như mọi thứ, hãy bổ sung kiến ​​thức của bạn bằng sách và nhiều tài nguyên trực tuyến khác