รับตัวแปรทั้งหมดในขอบเขต

มีวิธีรับตัวแปรทั้งหมดที่อยู่ในขอบเขตใน javascript หรือไม่

ไม่ตัวแปร "ในขอบเขต" ถูกกำหนดโดย "ขอบเขตลูกโซ่" ซึ่งไม่สามารถเข้าถึงได้ทางโปรแกรม

สำหรับรายละเอียด (ค่อนข้างมาก) ตรวจสอบข้อมูลจำเพาะ ECMAScript (JavaScript) นี่คือการเชื่อมโยงไปยังหน้าอย่างเป็นทางการที่คุณสามารถดาวน์โหลดข้อมูลจำเพาะบัญญัติ (ไฟล์ PDF) และนี่เป็นหนึ่งอย่างเป็นทางการ, HTML รุ่นที่เชื่อมโยงกัน

อัปเดตตามความคิดเห็นของคุณเป็น Camsoft

ตัวแปรในขอบเขตสำหรับฟังก์ชันเหตุการณ์ของคุณถูกกำหนดโดยที่คุณกำหนดฟังก์ชันเหตุการณ์ของคุณไม่ใช่วิธีที่พวกเขาเรียกมัน แต่คุณอาจพบข้อมูลที่เป็นประโยชน์เกี่ยวกับสิ่งที่มีอยู่กับการทำงานของคุณผ่านทางthisและการขัดแย้งโดยการทำสิ่งที่ตามเส้นของสิ่งที่ KennyTM ชี้ให้เห็น (คนfor (var propName in ____)) ตั้งแต่ที่จะบอกคุณว่ามีอยู่ในวัตถุต่างๆให้กับคุณ ( thisและข้อโต้แย้งนั้นถ้าคุณ ไม่แน่ใจว่าข้อโต้แย้งใดที่ให้คุณคุณสามารถค้นหาผ่านargumentsตัวแปรที่กำหนดโดยนัยสำหรับทุกฟังก์ชั่น)

ดังนั้นนอกเหนือจากสิ่งที่อยู่ในขอบเขตเนื่องจากคุณกำหนดฟังก์ชันของคุณคุณสามารถค้นหาว่ามีอะไรอีกบ้างที่มีให้โดยวิธีการอื่นโดยการทำ:

var n, arg, name;
alert("typeof this = " + typeof this);
for (name in this) {
    alert("this[" + name + "]=" + this[name]);
}
for (n = 0; n < arguments.length; ++n) {
    arg = arguments[n];
    alert("typeof arguments[" + n + "] = " + typeof arg);
    for (name in arg) {
        alert("arguments[" + n + "][" + name + "]=" + arg[name]);
    }
}

(คุณสามารถขยายเพื่อรับข้อมูลที่เป็นประโยชน์มากขึ้น)

แทนที่จะเป็นเช่นนั้นฉันอาจใช้ดีบักเกอร์เช่นเครื่องมือ dev ของ Chrome (แม้ว่าปกติคุณจะไม่ใช้ Chrome เพื่อการพัฒนา) หรือFirebug (แม้ว่าปกติคุณจะไม่ใช้ Firefox สำหรับการพัฒนา) หรือ Dragonfly บน Opera หรือ "เครื่องมือนักพัฒนา F12" บน IE และอ่านไฟล์ JavaScript ที่พวกเขาให้คุณ และเอาชนะพวกเขาเหนือหัวสำหรับเอกสารที่เหมาะสม :-)

แม้ว่าทุกคนจะตอบว่า " ไม่ " และฉันรู้ว่า "ไม่" เป็นคำตอบที่ถูกต้อง แต่ถ้าคุณต้องการได้รับตัวแปรท้องถิ่นของฟังก์ชั่นมันมีวิธีที่ จำกัด

พิจารณาฟังก์ชั่นนี้:

var f = function() {
    var x = 0;
    console.log(x);
};

คุณสามารถแปลงฟังก์ชั่นของคุณเป็นสตริง:

var s = f + '';

คุณจะได้รับแหล่งที่มาของฟังก์ชั่นเป็นสตริง

'function () {\nvar x = 0;\nconsole.log(x);\n}'

ตอนนี้คุณสามารถใช้ parser เช่นesprimaเพื่อแยกโค้ดฟังก์ชันและค้นหาการประกาศตัวแปรท้องถิ่น

var s = 'function () {\nvar x = 0;\nconsole.log(x);\n}';
s = s.slice(12); // to remove "function () "
var esprima = require('esprima');
var result = esprima.parse(s);

และค้นหาวัตถุด้วย:

obj.type == "VariableDeclaration"

ในผลลัพธ์ (ฉันลบconsole.log(x)ด้านล่าง):

{
    "type": "Program",
    "body": [
        {
            "type": "VariableDeclaration",
            "declarations": [
                {
                    "type": "VariableDeclarator",
                    "id": {
                        "type": "Identifier",
                        "name": "x"
                    },
                    "init": {
                        "type": "Literal",
                        "value": 0,
                        "raw": "0"
                    }
                }
            ],
            "kind": "var"
        }
    ]
}

ฉันได้ทำการทดสอบใน Chrome, Firefox และ Node แล้ว

แต่ปัญหาของวิธีนี้คือคุณเพียงแค่กำหนดตัวแปรในฟังก์ชั่นของตัวเอง ตัวอย่างเช่นอันนี้:

var g = function() {
    var y = 0;
    var f = function() {
        var x = 0;
        console.log(x);
    };
}

คุณเพียงแค่มีการเข้าถึงxและไม่Y แต่คุณยังสามารถใช้กลุ่มของผู้เรียก (arguments.callee.caller.caller.caller) ในลูปเพื่อค้นหาตัวแปรโลคัลของฟังก์ชันตัวเรียก ถ้าคุณมีชื่อตัวแปรท้องถิ่นเพื่อให้คุณมีตัวแปรขอบเขต ด้วยชื่อตัวแปรคุณสามารถเข้าถึงค่าด้วย eval อย่างง่าย

ใช่และไม่. "ไม่" ในเกือบทุกสถานการณ์ "ใช่" แต่ในลักษณะที่ จำกัด หากคุณต้องการตรวจสอบขอบเขตทั่วโลก นำตัวอย่างต่อไปนี้:

var a = 1, b = 2, c = 3;

for ( var i in window ) {
    console.log(i, typeof window[i], window[i]);
}

เอาต์พุตใดในจำนวน 150+ สิ่งต่อไปนี้:

getInterface function getInterface()
i string i // <- there it is!
c number 3
b number 2
a number 1 // <- and another
_firebug object Object firebug=1.4.5 element=div#_firebugConsole
"Firebug command line does not support '$0'"
"Firebug command line does not support '$1'"
_FirebugCommandLine object Object
hasDuplicate boolean false

ดังนั้นจึงเป็นไปได้ที่จะแสดงรายการตัวแปรบางอย่างในขอบเขตปัจจุบัน แต่ ไม่น่าเชื่อถือรวบรัดมีประสิทธิภาพหรือเข้าถึงได้ง่าย

คำถามที่ดีกว่าคือเหตุใดคุณต้องการทราบว่าตัวแปรใดบ้างที่อยู่ในขอบเขต

ใน ECMAScript 6 เป็นไปได้มากขึ้นหรือน้อยลงโดยการห่อโค้ดไว้ในwithคำสั่งที่มีวัตถุพร็อกซี โปรดทราบว่ามันต้องใช้โหมดที่ไม่เข้มงวดและเป็นการฝึกฝนที่ไม่ดี

function storeVars(target) {
  return new Proxy(target, {
    has(target, prop) { return true; },
    get(target, prop) { return (prop in target ? target : window)[prop]; }
  });
}
var vars = {}; // Outer variable, not stored.
with(storeVars(vars)) {
  var a = 1;   // Stored in vars
  var b = 2;   // Stored in vars
  (function() {
    var c = 3; // Inner variable, not stored.
  })();
}
console.log(vars);

พร็อกซีอ้างว่าเป็นเจ้าของตัวระบุทั้งหมดที่อ้างอิงภายในwithดังนั้นการกำหนดตัวแปรจะถูกเก็บไว้ในเป้าหมาย สำหรับการค้นหาพร็อกซีจะรับค่าจากเป้าหมายพร็อกซีหรือวัตถุส่วนกลาง (ไม่ใช่ขอบเขตหลัก) letและconstไม่รวมตัวแปร

แรงบันดาลใจจากคำตอบนี้โดยBergi

คุณทำไม่ได้

ตัวแปรตัวบ่งชี้ของการประกาศฟังก์ชันและอาร์กิวเมนต์สำหรับโค้ดฟังก์ชันถูกโยงเป็นคุณสมบัติของVariable Objectซึ่งไม่สามารถเข้าถึงได้

ดูสิ่งนี้ด้วย:

• ขอบเขตของห่วงโซ่และตัวระบุความละเอียด

วิธีที่ง่ายที่สุดในการเข้าถึง Vars ในขอบเขตเฉพาะ

1. เปิดเครื่องมือสำหรับนักพัฒนา> แหล่งข้อมูล (ใน Chrome)
2. เปิดไฟล์ที่มีฟังก์ชั่นที่สามารถเข้าถึงขอบเขตนั้นได้ (tip cmd / ctrl + p เพื่อค้นหาไฟล์)
3. ตั้งเบรกพอยต์ภายในฟังก์ชั่นนั้นและเรียกใช้รหัสของคุณ
4. เมื่อหยุดที่เบรกพอยต์คุณสามารถเข้าถึงขอบเขตขอบเขตผ่านคอนโซล (หรือหน้าต่างขอบเขตขอบเขต)

บันทึก:คุณต้องการทำเช่นนี้กับ js ที่ไม่เล็กสุด

วิธีที่ง่ายที่สุดในการแสดง Vars ที่ไม่ใช่ส่วนตัวทั้งหมด

1. เปิดคอนโซล (ใน Chrome)
2. ประเภท: this.window
3. กด Enter

ตอนนี้คุณจะเห็นแผนผังวัตถุที่คุณสามารถขยายได้ด้วยวัตถุที่ประกาศทั้งหมด

อย่างที่ทุกคนสังเกตเห็น: คุณทำไม่ได้ แต่คุณสามารถสร้าง obj และกำหนด var ที่คุณประกาศให้กับ obj นั้นได้ ด้วยวิธีนี้คุณสามารถตรวจสอบ vars ของคุณได้อย่างง่ายดาย:

var v = {}; //put everything here

var f = function(a, b){//do something
}; v.f = f; //make's easy to debug
var a = [1,2,3];
v.a = a;
var x = 'x';
v.x = x;  //so on...

console.log(v); //it's all there

ฉันทำซอปฏิบัติ (โดยพื้นฐาน) เหนือความคิดที่ระบุโดย iman นี่คือลักษณะที่ปรากฏเมื่อคุณเลื่อนเมาส์ไปที่ ipsum อันที่สองreturn ipsum*ipsum - ...

ตัวแปรที่อยู่ในขอบเขตจะถูกเน้นที่ตำแหน่งที่ถูกประกาศ (ด้วยสีที่แตกต่างกันสำหรับขอบเขตที่แตกต่างกัน) loremกับขอบสีแดงเป็นตัวแปรเงา (ไม่อยู่ในขอบเขต แต่ต้องอยู่ในขอบเขตถ้า lorem อื่น ๆ ต่อไปลงที่ต้นไม้จะไม่เป็นมี.)

ฉันกำลังใช้ห้องสมุด esprima เพื่อแยกวิเคราะห์ JavaScript และแยกส่วนแยกส่วนหลบหนี escope (ยูทิลิตี้ไลบรารีที่ด้านบนสุดของ esprima) 'การยกของหนัก' นั้นเสร็จสิ้นโดยห้องสมุดเหล่านั้น (ที่ซับซ้อนที่สุดคือ esprima

มันทำงานอย่างไร

ast = esprima.parse(sourceString, {range: true, sourceType: 'script'});

ทำให้ต้นไม้ไวยากรณ์ที่เป็นนามธรรม จากนั้น

analysis = escope.analyze(ast);

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

ดังนั้นคำตอบที่ถูกต้องไม่ใช่ "ไม่" แต่ "ใช่ แต่" "แต่" เป็นชิ้นใหญ่: โดยทั่วไปคุณต้องเขียนส่วนสำคัญของเบราว์เซอร์ chrome (และเป็น devtools) ใน JavaScript JavaScript เป็นภาษาทัวริงที่สมบูรณ์ดังนั้นแน่นอนว่าเป็นไปได้ในหลักการ สิ่งที่เป็นไปไม่ได้กำลังทำสิ่งทั้งหมดโดยไม่ต้องใช้ซอร์สโค้ดทั้งหมดของคุณ (เป็นสตริง) จากนั้นทำสิ่งที่ซับซ้อนสูงด้วยสิ่งนั้น

หากคุณต้องการตรวจสอบตัวแปรด้วยตนเองเพื่อช่วยในการดีบักให้เริ่มการทำงานของดีบักเกอร์:

debugger;

ตรงเข้าไปในคอนโซลของเบราว์เซอร์