มีเหตุผลอะไรที่ต้องใช้ null แทน undefined ใน JavaScript?

ฉันได้รับการเขียน JavaScript nullสำหรับค่อนข้างนานในขณะนี้และฉันไม่เคยมีเหตุผลที่จะใช้งาน ดูเหมือนว่าundefinedจะดีกว่าเสมอและตอบสนองวัตถุประสงค์เดียวกันทางโปรแกรม มีเหตุผลเชิงปฏิบัติอะไรบ้างที่ควรใช้nullแทนundefined?

Null และ undefined เป็นค่าที่แตกต่างกันสองค่าที่หมายถึงสิ่งเดียวกัน ข้อแตกต่างเพียงอย่างเดียวคือในรูปแบบของวิธีที่คุณใช้ในระบบของคุณ ดังที่บางคนได้กล่าวไว้บางคนใช้ค่า null สำหรับความหมายว่า "ไม่มีวัตถุ" ซึ่งบางครั้งคุณอาจได้รับวัตถุในขณะที่ไม่ได้กำหนดหมายความว่าไม่มีวัตถุใดที่คาดหวัง (หรือมีข้อผิดพลาด) ปัญหาของฉันเกี่ยวกับเรื่องนี้เป็นเรื่องตามอำเภอใจโดยสิ้นเชิงและไม่จำเป็นโดยสิ้นเชิง

ที่กล่าวว่ามีความแตกต่างที่สำคัญประการหนึ่งคือตัวแปรที่ไม่ได้เริ่มต้น (รวมถึงพารามิเตอร์ของฟังก์ชันที่ไม่มีการส่งผ่านอาร์กิวเมนต์เป็นต้น) จะไม่ได้กำหนดไว้เสมอ

ซึ่งเป็นเหตุผลว่าทำไมในรหัสของฉันฉันไม่เคยใช้ null เว้นแต่สิ่งที่ฉันไม่ได้ควบคุมจะคืนค่า null (เช่นการจับคู่ regex) ความสวยงามของสิ่งนี้มันทำให้หลาย ๆ อย่างง่ายขึ้น ฉันไม่ต้องตรวจสอบว่า x === ไม่ได้กำหนด || x === null และถ้าคุณมีนิสัยชอบใช้ == หรือง่ายๆเช่น if (x) ... หยุดนะ. !xจะประเมินเป็นจริงสำหรับสตริงว่าง 0, null, NaN - นั่นคือสิ่งที่คุณอาจไม่ต้องการ หากคุณต้องการเขียนจาวาสคริปต์ที่ไม่น่ากลัวให้ใช้ triple เท่ากับ === เสมอและอย่าใช้ null (ใช้ไม่ได้กำหนดแทน) มันจะทำให้ชีวิตของคุณง่ายขึ้น

ฉันไม่มีคำตอบจริงๆ แต่จากข้อมูลของNicholas C. Zakasหน้า 30 ของหนังสือ" Professional JavaScript for Web Developers " :

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

ในตอนท้ายของวันเนื่องจากทั้งสองnullและundefinedบีบบังคับให้เป็นค่าเดียวกัน ( Boolean(undefined) === false && Boolean(null) === false) คุณสามารถใช้เทคนิคอย่างใดอย่างหนึ่งเพื่อให้งานสำเร็จ อย่างไรก็ตามมีวิธีที่ถูกต้อง IMO

1. ปล่อยให้การใช้งานของundefinedคอมไพเลอร์ JavaScript

   undefinedใช้เพื่ออธิบายตัวแปรที่ไม่ได้ชี้ไปที่การอ้างอิง มันเป็นสิ่งที่คอมไพเลอร์ JS จะดูแลคุณ ที่รวบรวมเวลาเครื่องยนต์ JS undefinedจะกำหนดค่าของตัวแปรยกทั้งหมดไปยัง เมื่อเครื่องยนต์ก้าวผ่านรหัสและค่าต่างๆจะพร้อมใช้งานเอ็นจิ้นจะกำหนดค่าตามลำดับให้กับตัวแปรตามลำดับ undefinedสำหรับตัวแปรเหล่านั้นสำหรับคนที่ยังไม่พบค่าตัวแปรที่จะยังคงรักษาอ้างอิงถึงดั้งเดิม

2. ใช้ null เฉพาะเมื่อคุณต้องการระบุค่าของตัวแปรอย่างชัดเจนว่ามี "ไม่มีค่า"

   ในฐานะที่เป็น @ com2gz state: nullใช้เพื่อกำหนดสิ่งที่ว่างเปล่าโดยทางโปรแกรม undefinedหมายถึงการบอกว่าไม่มีการอ้างอิง nullค่าที่กำหนดไว้มีการอ้างอิงถึง "ไม่มีอะไร" undefinedหากคุณกำลังเรียกที่พักไม่ใช่ที่มีอยู่ของวัตถุแล้วคุณจะได้รับ ถ้าฉันจะทำให้ทรัพย์สินนั้นว่างเปล่าโดยเจตนาคุณก็ต้องnullรู้ว่ามันมีจุดประสงค์

TLDR; อย่าใช้undefinedแบบดั้งเดิม เป็นค่าที่คอมไพลเลอร์ JS จะกำหนดให้คุณโดยอัตโนมัติเมื่อคุณประกาศตัวแปรโดยไม่มีการกำหนดหรือหากคุณพยายามเข้าถึงคุณสมบัติของอ็อบเจ็กต์ที่ไม่มีการอ้างอิง ในทางกลับกันให้ใช้nullเฉพาะในกรณีที่คุณต้องการให้ตัวแปร "ไม่มีค่า" โดยเจตนา

ฉันไม่เคยตั้งค่าอะไรเป็น undefined อย่างชัดเจน (และฉันไม่เจอสิ่งนี้ใน codebases จำนวนมากที่ฉันโต้ตอบด้วย) nullนอกจากนี้ผมไม่ค่อยใช้ ครั้งเดียวที่ฉันใช้nullคือเมื่อฉันต้องการระบุค่าของอาร์กิวเมนต์ให้กับฟังก์ชันไม่มีค่าเช่น:

function printArguments(a,b) {
  console.log(a,b);
}

printArguments(null, " hello") // logs: null hello

ไม่ได้กำหนดคือที่ที่ไม่มีความคิดเกี่ยวกับสิ่งนั้น ไม่มีประเภทและไม่เคยมีการอ้างอิงมาก่อนในขอบเขตนั้น โมฆะคือสิ่งที่รู้ว่ามีอยู่จริง แต่ไม่มีค่า

ทุกคนมีวิธีการของตัวเองของการเข้ารหัสและความหมายภายในของพวกเขาเอง แต่ในช่วงหลายปีที่ผมได้พบนี้เป็นคำแนะนำที่ใช้งานง่ายที่สุดที่ฉันให้คนที่ถามคำถามนี้: เมื่อมีข้อสงสัยทำในสิ่งที่ไม่ JavaScript

สมมติว่าคุณกำลังทำงานกับคุณสมบัติของวัตถุเช่นตัวเลือกสำหรับ jQuery ปลั๊กอิน ... ถามตัวเองว่าคุ้มค่า JavaScript ให้ทรัพย์สินที่ยังไม่ได้มีการกำหนดไว้ - undefinedคำตอบคือ ดังนั้นในบริบทนี้ฉันจะเริ่มต้นสิ่งเหล่านี้ด้วย "ไม่ได้กำหนด" เพื่อให้สอดคล้องกับ JavaScript (สำหรับตัวแปรคุณสามารถทำได้var myVar;แทนvar myVar = undefined;)

สมมติว่าคุณกำลังทำการจัดการ DOM ... JavaScript กำหนดค่าใดให้กับองค์ประกอบที่ไม่มีอยู่จริง คำตอบคือnull. นี่คือค่าที่ฉันจะเริ่มต้นหากคุณกำลังสร้างตัวแปรตัวยึดตำแหน่งที่จะเก็บข้อมูลอ้างอิงไปยังองค์ประกอบส่วนเอกสารหรือสิ่งที่คล้ายกันในภายหลังซึ่งเกี่ยวข้องกับ DOM

หากคุณกำลังทำงานกับ JSON จำเป็นต้องมีกรณีพิเศษ: สำหรับค่าคุณสมบัติที่ไม่ได้กำหนดคุณควรตั้งค่าเป็น""หรือnullเนื่องจากค่าเป็นundefinedไม่ถือว่าเป็นรูปแบบ JSON ที่เหมาะสม

ด้วยสิ่งนี้ดังที่ผู้โพสต์ก่อนหน้านี้ได้แสดงไว้หากคุณพบว่าคุณกำลังเริ่มต้นสิ่งต่างๆด้วยดวงจันทร์สีน้ำเงินnullหรือundefinedมากกว่าหนึ่งครั้งบางทีคุณควรพิจารณาใหม่ว่าคุณจะเข้ารหัสแอปของคุณอย่างไร

คุณอาจยอมรับการประชุมที่แนะนำที่นี่ แต่ไม่มีเหตุผลที่ดีที่จะ ไม่ได้ใช้อย่างสม่ำเสมอเพียงพอที่จะมีความหมาย

ก่อนอื่นคุณต้องรู้ว่าฟังก์ชันที่เรียกว่าเป็นไปตามแบบแผน จากนั้นคุณต้องทดสอบค่าที่ส่งคืนอย่างชัดเจนและตัดสินใจว่าจะทำอย่างไร ถ้าคุณได้รับไม่ได้กำหนดคุณสามารถสรุปได้ว่าชนิดของข้อผิดพลาดบางอย่างเกิดขึ้นว่าฟังก์ชั่นที่เรียกว่ารู้เกี่ยวกับ แต่ถ้าเกิดข้อผิดพลาดขึ้นและฟังก์ชั่นรู้เรื่องนี้และจะมีประโยชน์ในการส่งสิ่งนั้นออกไปในสภาพแวดล้อมที่กว้างขึ้นทำไมไม่ใช้ออบเจ็กต์ข้อผิดพลาด เช่นโยนข้อผิดพลาด?

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

คุณสมบัติที่มีประโยชน์ในnullที่ไม่ได้กำหนดไม่มีคุณสมบัติ:

> null + 3
3
> undefined + 3
NaN

ฉันใช้nullเมื่อต้องการ 'ปิด' ค่าตัวเลขหรือเพื่อเริ่มต้นบางอย่าง การใช้งานครั้งล่าสุดของฉันคือการจัดการการแปลง css:

const transforms = { perspective : null, rotateX : null };
// if already set, increase, if not, set to x
runTimeFunction((x) => { trasforms.perspective += x; });
// still useful, as setting perspective to 0 is different than turning it off
runTimeFunction2((x) => { transforms.perspective = null; });

// toCss will check for 'null' values and not set then at all
runTimeFunction3(() => { el.style.transform = toCss(transforms); });

ไม่แน่ใจว่าควรใช้คุณสมบัตินี้คิดไหม...

โหนดและองค์ประกอบ DOM ไม่ได้กำหนด แต่อาจเป็นโมฆะ

• nextSibling ของลูกสุดท้ายขององค์ประกอบเป็นโมฆะ

• PreviousSibling ของลูกคนแรกเป็นโมฆะ

• การอ้างอิง document.getElementById เป็นโมฆะหากองค์ประกอบไม่มีอยู่ในเอกสาร

แต่ในไม่มีของกรณีเหล่านี้เป็นค่าที่ไม่ได้กำหนด ; ไม่มีโหนดอยู่ที่นั่น

มีบางคนกล่าวว่าสามารถเริ่มต้นวัตถุnullได้ ฉันแค่อยากจะชี้ให้เห็นว่า destructuring nullค่าเริ่มต้นของการโต้แย้งไม่ได้ทำงานกับ ตัวอย่างเช่น:

const test = ({ name } = {}) => {
  console.log(name)
}

test() // logs undefined
test(null) // throws error

ต้องทำการnullตรวจสอบก่อนเรียกใช้ฟังก์ชันซึ่งอาจเกิดขึ้นบ่อยครั้ง

ตอนนี้ฉันกำลังแก้ไขคำถามที่ตรงประเด็นนี้และมองไปที่ปรัชญาต่อไปนี้:

1. ฟังก์ชันใด ๆ ที่มีไว้เพื่อส่งคืนผลลัพธ์ควรส่งคืนค่าว่างหากไม่พบผลลัพธ์
2. ฟังก์ชันใด ๆ ที่ไม่ได้ตั้งใจที่จะส่งคืนผลลัพธ์โดยปริยายจะส่งคืนไม่ได้กำหนด

สำหรับฉันคำถามนี้มีความสำคัญเพราะใครก็ตามที่เรียกใช้ฟังก์ชันที่ส่งคืนผลลัพธ์ไม่ควรมีคำถามว่าจะทดสอบค่าไม่ระบุกับค่าว่างหรือไม่

คำตอบนี้ไม่ได้พยายามที่จะกล่าวถึง:

1. ค่าคุณสมบัติของ null เทียบกับไม่ได้กำหนด
2. ตัวแปรภายในฟังก์ชันของคุณเป็นค่าว่างเทียบกับไม่ได้กำหนด

ในความคิดของฉันตัวแปรเป็นธุรกิจของคุณเองและไม่ได้เป็นส่วนหนึ่งของ API ของคุณและคุณสมบัติในระบบ OO ใด ๆ ก็ได้รับการกำหนดดังนั้นจึงควรกำหนดด้วยค่าที่แตกต่างจากที่พวกเขาจะเป็นหากไม่ได้กำหนดไว้ (null สำหรับกำหนดไม่ได้กำหนดคือสิ่งที่คุณ ได้รับเมื่อเข้าถึงสิ่งที่ไม่อยู่ในวัตถุของคุณ)

นี่คือเหตุผล: var undefined = 1 เป็นจาวาสคริปต์ที่ถูกกฎหมาย แต่var null = 1เป็นข้อผิดพลาดทางไวยากรณ์ ความแตกต่างคือnullคำหลักภาษาในขณะที่undefinedด้วยเหตุผลบางประการไม่ใช่

หากโค้ดของคุณอาศัยการเปรียบเทียบundefinedราวกับว่าเป็นคีย์เวิร์ด ( if (foo == undefined)ซึ่งเป็นข้อผิดพลาดที่เกิดขึ้นได้ง่ายมาก) ซึ่งใช้ได้ผลเพราะไม่มีใครกำหนดตัวแปรด้วยชื่อนั้น โค้ดทั้งหมดนั้นเสี่ยงต่อการที่ใครบางคนกำหนดตัวแปรส่วนกลางด้วยชื่อนั้นโดยบังเอิญหรือมีเจตนาร้าย แน่นอนเราทุกคนรู้ดีว่าการกำหนดตัวแปรทั่วโลกโดยไม่ตั้งใจนั้นเป็นไปไม่ได้เลยในจาวาสคริปต์ ...

เพียงต้องการเพิ่มว่าด้วยการใช้ไลบรารีจาวาสคริปต์บางอย่าง null และไม่ได้กำหนดอาจมีผลที่ไม่คาดคิด

ตัวอย่างเช่นgetฟังก์ชันของ lodash ซึ่งยอมรับค่าเริ่มต้นเป็นอาร์กิวเมนต์ที่ 3:

const user = {
  address: {
    block: null,
    unit: undefined,
  }
}
console.log(_.get(user, 'address.block', 'Default Value')) // prints null
console.log(_.get(user, 'address.unit', 'Default Value')) // prints 'Default Value'
console.log(_.get(user, 'address.postalCode', 'Default Value')) // prints 'Default Value'

อีกตัวอย่างหนึ่ง: ถ้าคุณใช้ defaultProps ในการตอบสนองถ้าทรัพย์สินที่ถูกส่งผ่านnullอุปกรณ์ประกอบฉากเริ่มต้นจะไม่ได้ใช้เพราะnull ถูกตีความว่าเป็นค่าที่กำหนดไว้ เช่น

class MyComponent extends React.Component {
   static defaultProps = {
      callback: () => {console.log('COMPONENT MOUNTED')},
   }
   componentDidMount() {
      this.props.callback();
   }
}
//in some other component
<MyComponent />   // Console WILL print "COMPONENT MOUNTED"
<MyComponent callback={null}/>   // Console will NOT print "COMPONENT MOUNTED"
<MyComponent callback={undefined}/>   // Console WILL print "COMPONENT MOUNTED"

ฉันไม่เห็นด้วยอย่างยิ่งว่าการใช้งานว่างหรือไม่ได้กำหนดนั้นไม่จำเป็น ไม่ได้กำหนดคือสิ่งที่ทำให้กระบวนการผูกมัดต้นแบบทั้งหมดมีชีวิตอยู่ ดังนั้นคอมไพเลอร์ที่มี null เท่านั้นไม่สามารถตรวจสอบได้ว่าคุณสมบัตินี้เท่ากับ null หรือไม่ได้กำหนดไว้ใน endpoint ต้นแบบ ในภาษาพิมพ์แบบไดนามิกอื่น ๆ (fe Python) จะมีข้อยกเว้นหากคุณต้องการเข้าถึงคุณสมบัติที่ไม่ได้กำหนดไว้ แต่สำหรับคอมไพเลอร์ภาษาที่ใช้ต้นแบบควรตรวจสอบแม่แบบต้นแบบด้วยและนี่คือสถานที่ที่ไม่ได้กำหนดจำเป็นที่สุด

ความหมายทั้งหมดของการใช้ null เป็นเพียงการผูกตัวแปรหรือคุณสมบัติกับอ็อบเจ็กต์ซึ่งเป็นซิงเกิลตันและมีความหมายของความว่างเปล่าและการใช้ null ก็มีจุดประสงค์ด้านประสิทธิภาพ 2 รหัสนี้มีเวลาดำเนินการที่แตกต่างกัน

var p1 = function(){this.value = 1};
var big_array = new Array(100000000).fill(1).map((x, index)=>{
    p = new p1();
    if(index > 50000000){
       p.x = "some_string";
    }

    return p;
});
big_array.reduce((sum, p)=> sum + p.value, 0)

var p2 = function(){this.value = 1, p.x = null};
var big_array = new Array(100000000).fill(1).map((x, index)=>{
    p = new p2();
    if(index > 50000000){
       p.x = "some_string";
    }

    return p; 
});
big_array.reduce((sum, p)=> sum + p.value, 0)

ตัวแปรที่ไม่รู้จัก: undefined.

ตัวแปรที่รู้จัก แต่ไม่มีค่า: null.

1. server_objectคุณได้รับวัตถุจากเซิร์ฟเวอร์
2. server_object.errjคุณอ้างอิง undefinedมันจะบอกคุณว่ามันเป็น นั่นหมายความว่ามันไม่รู้ว่าคืออะไร
3. server_object.errตอนนี้คุณอ้างอิง nullมันจะบอกคุณว่ามันเป็น นั่นหมายความว่าคุณกำลังอ้างอิงตัวแปรที่ถูกต้อง แต่ว่างเปล่า จึงไม่มีข้อผิดพลาด

ปัญหาคือเมื่อคุณประกาศชื่อตัวแปรโดยไม่มีค่า ( var hello) js ประกาศว่าundefined: ไม่มีตัวแปรนี้ ในขณะที่โปรแกรมเมอร์ส่วนใหญ่หมายถึง:“ ฉันยังไม่ได้ให้ค่ามัน” คำจำกัดความของnull.

ดังนั้นพฤติกรรมเริ่มต้นของโปรแกรมเมอร์ - การประกาศตัวแปรโดยไม่มีค่าเป็นอะไร - ขัดแย้งกับ js - ประกาศว่าไม่มีอยู่ และนอกจากนี้!undefinedและ!nullมีทั้งสองอย่างtrueโปรแกรมเมอร์ส่วนใหญ่ถือว่าพวกเขาเทียบเท่ากัน

แน่นอนคุณสามารถตรวจสอบให้แน่ใจว่าคุณทำอยู่เสมอvar hello = nullแต่ส่วนใหญ่จะไม่ทิ้งรหัสของพวกเขาเช่นนี้เพื่อให้แน่ใจว่าประเภทมีสติสัมปชัญญะในภาษาที่พิมพ์อย่างหลวม ๆ โดยเจตนาเมื่อพวกเขาและ!ผู้ปฏิบัติงานปฏิบัติต่อทั้งสองอย่างundefinedและnullเท่าเทียมกัน