Có cần CSS để học JavaScript không?

điều kiện tiên quyết

Trước khi bắt đầu mô-đun này, bạn không cần có bất kỳ kiến ​​thức JavaScript nào trước đó, nhưng bạn nên có một số hiểu biết về HTML và CSS. Bạn nên làm việc thông qua các mô-đun sau trước khi bắt đầu với JavaScript

• Bắt đầu với Web [bao gồm phần giới thiệu JavaScript thực sự cơ bản]
• Giới thiệu về HTML
• Giới thiệu về CSS

Ghi chú. Nếu bạn đang làm việc trên máy tính/máy tính bảng/thiết bị khác mà bạn không có khả năng tạo tệp của riêng mình, bạn có thể thử [hầu hết] các ví dụ về mã trong một chương trình viết mã trực tuyến như JSBin hoặc Glitch

hướng dẫn

JavaScript là gì?

Chào mừng bạn đến với khóa học JavaScript dành cho người mới bắt đầu MDN. Trong bài viết đầu tiên này, chúng ta sẽ xem xét JavaScript từ cấp độ cao, trả lời các câu hỏi như "nó là gì?" và "nó đang làm gì?", đồng thời đảm bảo rằng bạn cảm thấy thoải mái với mục đích của JavaScript

Bây giờ bạn đã học được điều gì đó về lý thuyết JavaScript và những gì bạn có thể làm với nó, chúng tôi sẽ cung cấp cho bạn một khóa học cơ bản về các tính năng cơ bản của JavaScript thông qua một hướng dẫn hoàn toàn thực tế. Tại đây, bạn sẽ xây dựng một trò chơi "Đoán số" đơn giản, từng bước một

Khi bạn xây dựng trò chơi "Đoán số" trong bài viết trước, bạn có thể thấy rằng nó không hoạt động. Đừng bao giờ lo sợ — bài viết này nhằm mục đích giúp bạn không phải vò đầu bứt tóc trước những vấn đề như vậy bằng cách cung cấp cho bạn một số mẹo đơn giản về cách tìm và sửa lỗi trong các chương trình JavaScript

Sau khi đọc một vài bài viết trước, bây giờ bạn sẽ biết JavaScript là gì, nó có thể làm gì cho bạn, cách bạn sử dụng nó cùng với các công nghệ web khác và các tính năng chính của nó trông như thế nào ở cấp độ cao. Trong bài viết này, chúng ta sẽ tìm hiểu những điều cơ bản thực sự, xem xét cách làm việc với các khối xây dựng cơ bản nhất của JavaScript - Biến

Tại thời điểm này của khóa học, chúng ta thảo luận về toán học trong JavaScript — cách chúng ta có thể kết hợp các toán tử và các tính năng khác để thao tác thành công các con số nhằm thực hiện đặt giá thầu của mình

Tiếp theo, chúng ta sẽ chú ý đến các chuỗi - đây là những đoạn văn bản được gọi trong lập trình. Trong bài viết này, chúng ta sẽ xem xét tất cả những điều phổ biến mà bạn thực sự nên biết về chuỗi khi học JavaScript, chẳng hạn như tạo chuỗi, thoát dấu ngoặc kép trong chuỗi và nối chúng lại với nhau

Bây giờ chúng ta đã xem xét những điều cơ bản nhất về chuỗi, hãy chuyển sang bánh răng và bắt đầu suy nghĩ về những thao tác hữu ích mà chúng ta có thể thực hiện trên chuỗi bằng các phương thức tích hợp, chẳng hạn như tìm độ dài của chuỗi văn bản, nối và tách chuỗi,

Trong bài viết cuối cùng của mô-đun này, chúng ta sẽ xem xét mảng — một cách gọn gàng để lưu trữ danh sách các mục dữ liệu dưới một tên biến duy nhất. Ở đây chúng ta xem xét lý do tại sao điều này lại hữu ích, sau đó khám phá cách tạo một mảng, truy xuất, thêm và xóa các mục được lưu trữ trong một mảng, v.v.

đánh giá

Bài đánh giá sau đây sẽ kiểm tra hiểu biết của bạn về những kiến ​​thức cơ bản về JavaScript có trong các hướng dẫn ở trên

Trong bài đánh giá này, bạn sẽ được giao nhiệm vụ lấy một số kiến ​​thức đã học được trong các bài viết của mô-đun này và áp dụng nó để tạo một ứng dụng thú vị tạo ra những câu chuyện ngớ ngẩn ngẫu nhiên. Chúc vui vẻ

Xem thêm

Học JavaScript

Một tài nguyên tuyệt vời dành cho các nhà phát triển web đầy tham vọng — Học JavaScript trong môi trường tương tác, với các bài học ngắn và bài kiểm tra tương tác, được hướng dẫn bởi đánh giá tự động. 40 bài học đầu tiên miễn phí và toàn bộ khóa học có sẵn để thanh toán một lần nhỏ

Tương tự như vậy, khi học lập trình lần đầu tiên, nếu bạn tiếp xúc với nhiều khái niệm lý thuyết mới trước khi bạn viết mã đầu tiên, thì bạn sẽ tự động mất hứng thú trong vòng vài ngày.

Có hai yếu tố chính để học bất kỳ kỹ năng mới nào

1. Rào cản gia nhập thấp
2. Phản hồi tức thì

JavaScript có cả hai. Rất dễ dàng để bắt đầu và bạn có thể thấy kết quả hiển thị với số lượng mã tối thiểu so với các ngôn ngữ khác

Có, bạn cũng sẽ phải học HTML và CSS, vì đó là cách bạn hiển thị mọi thứ. JavaScript chạy phía sau hậu trường và tương tác với HTML và CSS để thực hiện các thay đổi trên màn hình

Bạn sẽ phải viết mã GUI [Giao diện người dùng đồ họa] bằng HTML và CSS

Tuy nhiên, thực hiện GUI bằng các ngôn ngữ khác phức tạp hơn nhiều so với thực hiện bằng HTML và CSS. Ví dụ: hãy tạo một hộp vuông bằng HTML

Điều này tạo ra một hộp 100x100 px, với nền đỏ và đường viền màu xám đồng nhất 1px. Và "div" là viết tắt của phép chia. Bất cứ điều gì bạn không nhận được ở đó?

Thật dễ dàng, phải không?

Để tạo cùng một hộp này bằng bất kỳ ngôn ngữ nào khác, trước tiên bạn phải nhập một số thư viện GUI, sau đó tạo một cửa sổ, sau đó xử lý cửa sổ đó và sau đó bạn phải viết mã hộp trên cửa sổ đó

Ba bước bổ sung đầu tiên đó có thể dễ dàng làm bạn nản lòng và phá hủy niềm yêu thích viết mã của bạn

Khi học một kỹ năng mới hoặc trau dồi một thói quen mới, rào cản gia nhập thấp là rất quan trọng để duy trì tính nhất quán

Tôi ghét khi phải giải thích 13 khái niệm phức tạp cho học sinh trước khi dạy chúng viết chữ “Xin chào”. ” trong GUI

Nhưng tại sao tôi lại đặt nặng vấn đề GUI?

Tạo một máy tính để cộng các số trong bảng điều khiển đen trắng thực sự là một công việc nhàm chán đối với người mới bắt đầu. Di chuyển các hộp trên màn hình khi chúng tôi nhấp vào nó cảm thấy tuyệt vời. Nó khuyến khích những người mới bắt đầu tìm hiểu thêm, thay vì bỏ cuộc sớm

Được rồi, quay lại câu hỏi của chúng ta

Bạn có cần học HTML và CSS để học JavaScript không?

Đúng

Và đó không phải là một bất lợi, nó thực sự là một lợi thế

Bạn nên tạo GUI bằng HTML và CSS, theo cách đó bạn sẽ học thêm hai công nghệ có thể áp dụng cho web và thiết bị di động

Trên thực tế, HTML và CSS rất tốt và dễ dàng để tạo GUI, đến nỗi nhiều ngôn ngữ khác đang bắt đầu sử dụng nó làm cách tạo GUI của họ

Vì vậy, học HTML và CSS không chỉ dễ dàng so với học GUI bằng các ngôn ngữ khác, nó còn hữu ích hơn

Nếu bạn chưa bao giờ viết mã HTML và CSS, thì hướng dẫn này sẽ giúp bạn bắt đầu. Bức thư tình của Batman trong HTML — mã HTML đầu tiên của bạn

Khi tôi nói JavaScript nên là ngôn ngữ lập trình đầu tiên của bạn, ý tôi là JavaScript vanilla đơn giản hoạt động trong trình duyệt của bạn ngay lập tức

Không Nodejs, không React, không TypeScript, không jQuery — chỉ JavaScript đơn giản

Ngoài ra, nhiều tính năng mới được giới thiệu cho JavaScript hàng năm. Nếu bạn không thể quyết định xem mình có nên học nó hay không, thì đây là lối tắt dành cho bạn. nếu trình duyệt của bạn không hỗ trợ nó, đừng đi sâu vào nó. Giai đoạn = Stage

Tôi muốn nhắc lại một điều cụ thể — không có jQuery

Tôi bắt đầu hành trình tìm hiểu JavaScript với jQuery, giống như nhiều người mới bắt đầu tự học đã làm, và tôi rất tiếc về điều đó. Tôi ước tôi đã đầu tư nhiều hơn một chút nỗ lực vào việc học JavaScript đơn giản trước

Tôi tin rằng trước khi học một ngôn ngữ, bạn phải biết tại sao nó tồn tại ngay từ đầu và nó sẽ đi về đâu

Vì vậy, đây là hành trình ngắn của JavaScript

Khi các trình duyệt Web đầu tiên được phát hành, mọi người sớm nhận ra rằng họ cần một ngôn ngữ kịch bản để làm cho các trang web trở nên tương tác hơn. Các nhà phát triển web rất muốn có các chức năng này

• xử lý logic. HTML và CSS chỉ xác định giao diện của trang web, chúng không xử lý bất kỳ logic nào. Ví dụ sử dụng. Để hiển thị thông báo lỗi nếu người dùng quên điền vào trường bắt buộc trong biểu mẫu. Ở đây chúng ta cần xử lý logic kiểm tra xem một trường có bắt buộc không và để trống
• xử lý dữ liệu. Trước JavaScript, bạn phải gửi dữ liệu đến máy chủ, sau đó xử lý dữ liệu trong máy chủ rồi gửi lại, vì không có cách nào xử lý dữ liệu bên trong trình duyệt. Ví dụ sử dụng. Hiển thị bản xem trước của một bài đăng trước khi lưu nó. Ở đây chúng tôi cần cập nhật bản xem trước với dữ liệu người dùng đã nhập mà không gửi nó đến máy chủ
• Thao tác HTML & CSS. Các nhà phát triển web rất cần một số cách để truy cập và thao tác theo chương trình các phần tử HTML và các kiểu CSS của họ. Ví dụ sử dụng. Để cung cấp cho trường biểu mẫu trống một đường viền màu đỏ, cho biết rằng người dùng phải nhập dữ liệu được yêu cầu vào trường. Ở đây chúng ta cần đưa ra một ranh giới màu đỏ cho một phần tử từ tập lệnh
• Xử lý sự kiện. Bất kỳ ngôn ngữ kịch bản nào sẽ không được sử dụng nhiều nếu nó không thể nắm bắt và xử lý các sự kiện của người dùng và trình duyệt. Ví dụ sử dụng. Thêm một mặt hàng vào giỏ hàng khi nhấp vào nút “Thêm vào giỏ hàng”. Ở đây chúng ta cần xử lý sự kiện “click” vào nút “Add to Cart”
• Liên lạc. Trước JavaScript, cách duy nhất để gửi dữ liệu đến máy chủ từ một trang web là thông qua “biểu mẫu”. Điều này đặt ra một hạn chế lớn đối với các nhà phát triển web. Ví dụ sử dụng. khi bạn muốn liên lạc với máy chủ nhưng không muốn người dùng gửi biểu mẫu cho nó

Năm lý do chính này đã khai sinh ra JavaScript. JavaScript có tất cả các tính năng này

Bây giờ hãy xem JavaScript đang hướng tới đâu

• Phát triển phía máy chủ. NodeJS đã mở ra một nền tảng lớn cho các nhà phát triển JavaScript. Giờ đây, bạn có thể tạo ứng dụng máy tính để bàn và máy chủ bằng JavaScript mà không cần bất kỳ trình duyệt nào. Có, JavaScript bên ngoài trình duyệt
• Phát triển điện thoại di động. Có một số trình phát trong lĩnh vực này cho phép bạn tạo các ứng dụng dành cho thiết bị di động bằng HTML, CSS và JavaScript. React Native cho phép bạn viết các ứng dụng di động gốc bằng JavaScript. Thú vị thật
• Công cụ JavaScript nhanh hơn. Những con cá lớn trên thị trường — Mozilla, Google và Apple — tất cả họ đều đang cạnh tranh để xây dựng trình thông dịch JavaScript nhanh nhất bên trong trình duyệt của bạn, làm cho các ứng dụng web nhanh gần bằng các ứng dụng gốc

Vì vậy, nếu bạn biết JavaScript, bạn có thể tạo Ứng dụng web, Phần cuối máy chủ, Ứng dụng dành cho máy tính để bàn và Ứng dụng dành cho thiết bị di động. Hiếm có ngôn ngữ nào có phạm vi ứng dụng rộng như vậy

Nhưng JavaScript không phải là ngôn ngữ lập trình. Đó là một ngôn ngữ kịch bản

Vâng, tôi đã có thể nghe thấy rất nhiều người đã đọc một vài bài báo trên wiki hét lên câu trên

Vấn đề là, nó có quan trọng không?

Với nhiều loại ứng dụng mà bạn có thể tạo, cộng với vô số cơ hội nghề nghiệp mà nó mở ra, không có lý do gì để phân loại nó là ngôn ngữ kịch bản hay ngôn ngữ lập trình

Điều quan trọng là - nó hoàn thành tốt rồi anh bạn

Không có gì ngạc nhiên khi phần lớn các câu chuyện thành công được đăng trên Reddit và các diễn đàn khác là về cách một lập trình viên tự học có được công việc Phát triển giao diện người dùng trong một công ty CNTT lớn hoặc một Công ty khởi nghiệp địa phương.

Bởi vì phát triển Frontend [HTML + CSS + JS] là con đường dễ dàng và nhanh nhất để có được sự nghiệp lập trình

Dưới đây là một số lợi thế nếu bạn đang bắt đầu hành trình của mình với HTML, CSS và JavaScript

• Nhà phát triển giao diện người dùng. Mức lương trung bình. $76,200
• Nhà phát triển nút. Mức lương trung bình. $91,668
• Lập trình viên full stack. Mức lương trung bình. $110,597
• Cơ hội việc làm từ xa. làm việc từ bất kỳ nơi nào trên thế giới
• Dễ kiếm việc làm tự do so với các ngôn ngữ khác
• Dễ dàng xây dựng danh mục đầu tư so với các ngôn ngữ khác

Tôi tin rằng cách nhanh nhất để dạy ai đó một kỹ năng mới là bắt đầu với những điều thú vị và dạy những điều nhàm chán sau đó.

Thật không may, hầu hết các hướng dẫn và khóa học trực tuyến đều làm ngược lại. Họ dạy những khái niệm nhàm chán trước, và học sinh mất hứng thú và ý chí trước khi những điều thú vị bắt đầu

Nếu khóa học JavaScript của bạn có chương đầu tiên về biến, chương thứ hai về hàm và chương thứ ba về mảng, thì hãy đoán xem, 90% sinh viên thậm chí sẽ không học đến chương thứ 4

Tôi đang trên hành trình thay đổi điều này. Tôi đang viết các bài hướng dẫn bạn xây dựng mọi thứ trước và học lý thuyết sau. Bằng cách này, bạn không mất hứng thú và tiếp tục học

Tôi có thể chuyển CSS sang JavaScript không?

Tôi có nên thành thạo CSS trước JavaScript không?

Tôi có thể chạy JavaScript mà không cần HTML và CSS không?

Tôi nên học bao nhiêu CSS trước JavaScript?