Underscore.JS - การตั้งค่าสภาพแวดล้อม

ในบทนี้คุณจะได้เรียนรู้รายละเอียดเกี่ยวกับการตั้งค่าสภาพแวดล้อมการทำงานของ Underscore.JS บนเครื่องคอมพิวเตอร์ของคุณ ก่อนที่คุณจะเริ่มทำงานกับ Underscore.JS คุณต้องมีสิทธิ์เข้าถึงไลบรารี คุณสามารถเข้าถึงไฟล์ได้ด้วยวิธีการใด ๆ ต่อไปนี้ -

วิธีที่ 1: การใช้ไฟล์ Underscore.JS ในเบราว์เซอร์

ในวิธีนี้เราจะต้องใช้ไฟล์ Underscore.JS จากเว็บไซต์ทางการและจะใช้โดยตรงในเบราว์เซอร์

ขั้นตอนที่ 1

ขั้นแรกให้ไปที่เว็บไซต์ทางการของ Underscore.JS https://underscorejs.org/.

สังเกตว่ามีตัวเลือกให้ดาวน์โหลดซึ่งจะช่วยให้คุณล่าสุดขีด-min.js ไฟล์UMD (การผลิต)ที่มีอยู่ คลิกขวาที่ลิงค์แล้วเลือกบันทึกเป็น โปรดทราบว่าไฟล์สามารถใช้ได้ทั้งแบบและไม่มีการย่อขนาด

ขั้นตอนที่ 2

ตอนนี้รวม underscore-min.js ข้างใน scriptแท็กและเริ่มทำงานกับ Underscore.JS สำหรับสิ่งนี้คุณสามารถใช้รหัสที่ระบุด้านล่าง -

<script type = "text/JavaScript" src = "https://underscorejs.org/underscore-min.js"></script>

ให้นี่คือตัวอย่างการทำงานและผลลัพธ์เพื่อความเข้าใจที่ดีขึ้น -

ตัวอย่าง

<html>
   <head>
      <title>Underscore.JS - Working Example</title>
      <script type = "text/JavaScript" src = "https://underscorejs.org/underscore-min.js"></script>
      <style>
         div {
            border: solid 1px #ccc;
            padding:10px;
            font-family: "Segoe UI",Arial,sans-serif;
            width: 50%;
         }
      </style>
   </head>
   <body>
      <div style = "font-size:25px" id = "list">
	  </div>
      <script type = "text/JavaScript">
         var numbers = [1, 2, 3, 4];
         var listOfNumbers = '';
         _.each(numbers, function(x) { listOfNumbers += x + ' ' });
         document.getElementById("list").innerHTML = listOfNumbers;
      </script>
   </body>
</html>

เอาต์พุต

วิธีที่ 2: การใช้ Node.js

หากคุณเลือกใช้วิธีนี้ตรวจสอบให้แน่ใจว่าคุณมี Node.js และ npmติดตั้งในระบบของคุณ คุณสามารถใช้คำสั่งต่อไปนี้เพื่อติดตั้ง Underscore.JS -

npm install underscore

คุณสามารถสังเกตผลลัพธ์ต่อไปนี้เมื่อติดตั้ง Underscore.JS สำเร็จ -

+ [email protected]
added 1 package from 1 contributor and audited 1 package in 6.331s
found 0 vulnerabilities

ตอนนี้เพื่อทดสอบว่า Underscore.JS ทำงานได้ดีกับ Node.js หรือไม่ให้สร้างไฟล์ tester.js และเพิ่มรหัสต่อไปนี้ -

var _ = require('underscore');
var numbers = [1, 2, 3, 4];
var listOfNumbers = '';
_.each(numbers, function(x) { listOfNumbers += x + ' ' });
console.log(listOfNumbers);

บันทึกโปรแกรมข้างต้นใน tester.js. คำสั่งต่อไปนี้ใช้เพื่อคอมไพล์และรันโปรแกรมนี้

คำสั่ง

\>node tester.js

เอาต์พุต

1 2 3 4