จริงๆ แล้วฟังก์ชั่นของ eval นั้นง่ายมาก โดยการส่งสตริงไปยังล่าม JS และล่าม Javascript จะตีความสตริงเป็นโค้ด Javascript และดำเนินการ
ยกตัวอย่างที่ง่ายที่สุด:
คัดลอกรหัสรหัสดังต่อไปนี้:
<script type="text/javascript">
eval("แจ้งเตือน(1+1)");
สคริปต์>
ง่ายมาก โดยตีความสตริงเป็นโค้ด JS แล้วดำเนินการ จากนั้น 2 จะปรากฏขึ้นมา
แน่นอนว่าตัวอย่างข้างต้นเป็นเพียงของเล่น และคงไม่มีใครโง่พอที่จะใช้มันในทางปฏิบัติ ฉันคิดว่าวิธีพื้นฐานที่สุดในการใช้ฟังก์ชัน eval คือใน DOM ตัวอย่างเช่น หากเรามี div1, div2 และ div3 ก็ไม่มีทางที่จะรับ ID ของเราได้เมื่อใช้ document.getElementByID ใช้ใน for loop ใช้ eval เพื่อประกบโปรแกรมดังกล่าว ตัวอย่างเช่น:
คัดลอกรหัสรหัสดังต่อไปนี้:
<script type="text/javascript">
สำหรับ (var ลูป = 1; ลูป <10; ลูป ++) {
eval('document.getElementById("div"+loop).innerHTML="123"');
-
สคริปต์>
หลังจากพูดถึงการใช้งานขั้นพื้นฐานแล้ว ผมเชื่อว่าทุกคนยังคงสนใจฟังก์ชันนี้อยู่ ถ้าฟังก์ชันนี้มีการใช้งานเพียงเล็กน้อยก็คงจะน่าเบื่อเกินไป มาดูฟังก์ชัน eval() กันทีละนิด
เริ่มต้นด้วยขอบเขตของ eval และดูที่ฟังก์ชันนี้:
คัดลอกรหัสรหัสดังต่อไปนี้:
<script type="text/javascript">
eval("var i=3");
การแจ้งเตือน (ฉัน);
สคริปต์>
รหัสนั้นง่ายมาก และผลลัพธ์สามารถปรากฏขึ้นมาได้ 3 รายการ ถัดไปเปรียบเทียบรหัสนี้:
คัดลอกรหัสรหัสดังต่อไปนี้:
<script type="text/javascript">
การทดสอบ var = ฟังก์ชั่น () {
eval("var i=3");
การแจ้งเตือน (i);
-
ทดสอบ();
การแจ้งเตือน (i);
สคริปต์>
ผลลัพธ์ก็คือ 3 ปรากฏขึ้นก่อน จากนั้นจึงไม่ได้กำหนด
ดังนั้นอธิบายว่า: โค้ดที่ดำเนินการแบบไดนามิกโดยฟังก์ชัน eval() ไม่ได้สร้างขอบเขตใหม่และโค้ดของโค้ดนั้นจะถูกดำเนินการในขอบเขตปัจจุบัน กล่าวอีกนัยหนึ่ง ฟังก์ชัน eval() ยังสามารถใช้สิ่งนี้ อาร์กิวเมนต์ และอ็อบเจ็กต์อื่นๆ ในขอบเขตปัจจุบันได้
ใน IE รองรับฟังก์ชันที่คล้ายกับ eval() มาก: execScript() เราสามารถเขียนโค้ดง่ายๆ
คัดลอกรหัสรหัสดังต่อไปนี้:
<script type="text/javascript">
การทดสอบ var = ฟังก์ชั่น () {
execScript("var i=3");
การแจ้งเตือน (ฉัน);
-
ทดสอบ();
การแจ้งเตือน (ฉัน);
สคริปต์>
เป็นผลให้มี 3 สองตัวปรากฏขึ้น สิ่งนี้ยังแสดงคุณสมบัติของฟังก์ชัน execScript ประการแรก มันคล้ายกับ eval มันสามารถตีความสตริงเป็นโค้ด JS และดำเนินการได้ แต่ขอบเขตของมันไม่ใช่ขอบเขตปัจจุบัน ขอบเขตทั่วโลก เมื่อเราลองใช้โค้ดข้างต้นบน Firefox และ Google Chrome: เราพบว่าโค้ดบน execScript ไม่ถูกต้องบน Firefox ซึ่งแสดงให้เห็นปัญหาด้วย มีปัญหากับความเข้ากันได้ของเบราว์เซอร์ของโค้ด execScript
ถ้าอย่างนั้นคำถามก็เกิดขึ้นว่าเราจะรวบรวม "ข้อดี" ของทั้งสองฟังก์ชันนี้ได้อย่างไรนั่นคือความเข้ากันได้ทั่วโลก + เบราว์เซอร์ ฉันค้นหาในอินเทอร์เน็ตและสรุปด้วยตัวเองซึ่งน่าจะเป็นดังนี้:
คัดลอกรหัสรหัสดังต่อไปนี้:
<script type="text/javascript">
var StrongEval = ฟังก์ชั่น (รหัส) {
ถ้า (window.navigator.userAgent.indexOf("MSIE") >= 1) {
execScript(รหัส);
-
ถ้า (window.navigator.userAgent.indexOf("Firefox") >= 1) {
window.eval(รหัส);
-
อื่น {
execScript(รหัส);
-
-
การทดสอบ var = ฟังก์ชั่น () {
StrongEval("var i=3");
-
ทดสอบ();
การแจ้งเตือน (i);
สคริปต์>
ด้วยวิธีนี้ จึงสามารถใช้งานร่วมกับ FF และ IE ได้อย่างสมบูรณ์แบบ โค้ดที่สำคัญคือ eval และ window.eval ไม่เทียบเท่าใน FF นี่เป็นสิ่งที่แปลกมาก
นอกจากนี้เรายังสามารถใช้ eval+with เพื่อให้ได้ลูกเล่นแปลกๆ อีกด้วย
โดยทั่วไปแล้ว เราสามารถเขียนโค้ดได้ดังนี้:
คัดลอกรหัสรหัสดังต่อไปนี้:
var obj = ฟังก์ชั่น () {
นี่.a = 1;
นี่.b = 2;
นี่ค = 5;
this.fun = ฟังก์ชั่น () {
this.c = this.a + this.b;
-
-
var o = ใหม่ obj();
o.สนุก();
การแจ้งเตือน (oc);
หรือสิ่งนี้:
คัดลอกรหัสรหัสดังต่อไปนี้:
วาร์ obj = {
ก: 1,
ข: 2,
ค: 5,
สนุก: ฟังก์ชั่น () {
this.c = this.a + this.b;
-
-
หรือสิ่งนี้:
คัดลอกรหัสรหัสดังต่อไปนี้:
var obj = ฟังก์ชั่น () {
นี่.a = 1;
นี่.b = 2;
นี่ค = 5;
-
obj.prototype.fun = ฟังก์ชั่น () {
this.c = this.a + this.b;
-
var o = ใหม่ obj();
o.สนุก();
การแจ้งเตือน (oc);
ไม่ว่าคุณจะเบื่อกับความรู้สึกแบบนี้ไหม? ถ้าอย่างนั้นให้เราใช้แนวทางที่แตกต่างออกไปมาก เพื่ออย่างน้อยที่สุดก็อาจจะรู้สึกสบายขึ้น
คัดลอกรหัสรหัสดังต่อไปนี้:
<script type="text/javascript">
var funtemp = ฟังก์ชั่น () {
ค = ก + ข;
-
วาร์ obj = {
ก: 1,
ข: 2,
ค: 5
-
สนุกจังเลย;
ด้วย (obj) {
eval("สนุก = " + funtemp);
-
สนุก();
การแจ้งเตือน (obj.c);
สคริปต์>
อันนี้บังคับมากและดีมาก เราจะไม่เถียงว่ามันดูสบายตัวหรือไม่ เรามาหารือเกี่ยวกับสถานการณ์ดังกล่าว
คัดลอกรหัสรหัสดังต่อไปนี้:
<สคริปต์>
varDBCommon = ฟังก์ชั่น () {
alert("1."); CreateConnection();
alert("2."); OpenConnection();
alert("3."); CreateCommand();
alert("4."); ExcuteCommand();
alert("5."); ปิดการเชื่อมต่อ();
-
var SQLServerCommon = {
CreateConnection: function () { alert("สร้างการเชื่อมต่อ SQL Server" },
OpenConnection: function () { alert("เปิดการเชื่อมต่อ SQL Server"); }
CreateCommand: function () { alert("สร้างคำสั่ง SQL Server");
ExcuteCommand: function () { alert("ดำเนินการคำสั่ง DSQL Server");
CloseConnection: ฟังก์ชั่น () { การแจ้งเตือน ("ปิดการเชื่อมต่อเซิร์ฟเวอร์ SQL"); }
-
var OracleCommon = {
CreateConnection: function () { alert("สร้าง ￠การเชื่อมต่อ Oracle"); }
OpenConnection: function () { alert("เปิดการเชื่อมต่อ aOracle");
CreateCommand: function () { alert("สร้างคำสั่ง Oracle");
ExcuteCommand: function () { alert("ดำเนินการคำสั่ง DOracle");
CloseConnection: function () { alert("ปิด?การเชื่อมต่อ Oracle");
-
ด้วย (SQLServerCommon) {
eval("forSQLServer=" + DBCommon);
-
ด้วย (OracleCommon) {
eval("forOracle=" + DBCommon);
-
forSQLServer();
สำหรับออราเคิล();
สคริปต์>
เราคิดว่านี่เป็นรูปแบบวิธีการเทมเพลตอย่างง่ายได้ไหม อิอิ นอกจากนี้เรายังสามารถเรียกสิ่งนี้ว่า eval และ with เพื่อเปลี่ยนบริบทของฟังก์ชัน
แต่ขอย้ำอีกครั้งว่า Eval ไม่ค่อยถูกใช้ในสถานการณ์ทั่วไป และเราสามารถหลีกเลี่ยงการใช้มันได้อย่างสมบูรณ์