ජාවාස්ක්‍රිප්ට් හි ශුන්‍ය සිසිලන ක්‍රියාකරුවෙකු සිටීද?

උදාහරණයක් ලෙස, C # හි මට මෙය කළ හැකිය:

String someString = null;
var whatIWant = someString ?? "Cookies!";

ජාවාස්ක්‍රිප්ට් සඳහා මට හඳුනාගත හැකි හොඳම දළ විශ්ලේෂණය වන්නේ කොන්දේසි සහිත ක්‍රියාකරු භාවිතා කිරීමයි:

var someString = null;
var whatIWant = someString ? someString : 'Cookies!';

මොන වගේද IMHO. මට මීට වඩා හොඳින් කළ හැකිද?

යාවත්කාලීන කරන්න

ජාවාස්ක්‍රිප්ට් දැන් ශුන්‍ය සිසිලන ක්‍රියාකරුට (??) සහය දක්වයි . එහි දකුණු පස නැවත යන අගයද විට එහි වාම පස යන අගයද වේ nullහෝ undefined, හා වෙනත් එහි ඉතිරි පස යන අගයද පැමිණේ.

කරුණාකර එය භාවිතා කිරීමට පෙර අනුකූලතාව පරීක්ෂා කරන්න.

C # null coalescing operator ( ??) ට සමාන JavaScript තාර්කික OR ( ||) භාවිතා කරයි :

var whatIWant = someString || "Cookies!";

හැසිරීම C # හි හැසිරීමට නොගැලපෙන අවස්ථා තිබේ (පහත පැහැදිලි කර ඇත), නමුත් මෙය ජාවාස්ක්‍රිප්ට් හි පෙරනිමි / විකල්ප අගයන් පැවරීමේ සාමාන්‍ය, දැඩි ක්‍රමයයි.

පැහැදිලි කිරීම

පළමු ඔපෙරන්ඩ් වර්ගය කුමක් වුවත්, එය බූලියන් ප්‍රති cast ලයකට දැමුවහොත් false, පැවරුම දෙවන ඔපෙරන්ඩ් භාවිතා කරයි. පහත ඇති සියලුම සිද්ධීන්ගෙන් පරිස්සම් වන්න:

alert(Boolean(null)); // false
alert(Boolean(undefined)); // false
alert(Boolean(0)); // false
alert(Boolean("")); // false
alert(Boolean("false")); // true -- gotcha! :)

මෙයින් අදහස් වන්නේ:

var whatIWant = null || new ShinyObject(); // is a new shiny object
var whatIWant = undefined || "well defined"; // is "well defined"
var whatIWant = 0 || 42; // is 42
var whatIWant = "" || "a million bucks"; // is "a million bucks"
var whatIWant = "false" || "no way"; // is "false"

function coalesce() {
    var len = arguments.length;
    for (var i=0; i<len; i++) {
        if (arguments[i] !== null && arguments[i] !== undefined) {
            return arguments[i];
        }
    }
    return null;
}

var xyz = {};
xyz.val = coalesce(null, undefined, xyz.val, 5);

// xyz.val now contains 5

මෙම විසඳුම SQL coalesce ශ්‍රිතය මෙන් ක්‍රියා කරයි, එය ඕනෑම තර්ක ගණනාවක් පිළිගන්නා අතර ඒවායින් කිසිවක් වටිනාකමක් නොමැති නම් එය අහෝසි වේ. එය C # මෙන් හැසිරේ. "", අසත්‍යය සහ 0 යන්න NULL ලෙස නොසැලකෙන අතර එබැවින් සත්‍ය අගයන් ලෙස ගණන් ගනී. ඔබ .net පසුබිමකින් පැමිණියහොත් මෙය වඩාත් ස්වාභාවික හැඟීම් විසඳුම වනු ඇත.

ඔව්, එය ඉක්මනින් පැමිණේ. බලන්න මෙතන යෝජනාව හා මෙහි ක්රියාත්මක තත්වය .

එය මේ වගේ ය:

x ?? y

උදාහරණයක්

const response = {
  settings: {
    nullValue: null,
    height: 400,
    animationDuration: 0,
    headerText: '',
    showSplashScreen: false
  }
};

const undefinedValue = response.settings?.undefinedValue ?? 'some other default'; // result: 'some other default'
const nullValue = response.settings?.nullValue ?? 'some other default'; // result: 'some other default'
const headerText = response.settings?.headerText ?? 'Hello, world!'; // result: ''
const animationDuration = response.settings?.animationDuration ?? 300; // result: 0
const showSplashScreen = response.settings?.showSplashScreen ?? true; // result: false

නම් ||C # ගේ ආදේශනයක් ලෙස ??ඔබේ නඩුව හොඳ ප්රමාණවත් නොවන අතර, එය හිස් නම් නූල් හා බිංදු ගිලිනවා නිසා, සෑම විටම ඔබට, ඔබේ ම කාර්යය ලියන්න පුළුවන්:

 function $N(value, ifnull) {
    if (value === null || value === undefined)
      return ifnull;
    return value;
 }

 var whatIWant = $N(someString, 'Cookies!');

මෙහි විභවය කිසිවෙකු මෙහි සඳහන් කර නැත NaN, එය - මට - ද ශුන්‍ය අගයක් වේ. ඉතින්, මම හිතුවා මගේ ශත දෙක එකතු කරන්න.

දී ඇති කේතය සඳහා:

var a,
    b = null,
    c = parseInt('Not a number'),
    d = 0,
    e = '',
    f = 1
;

ඔබ ||ක්‍රියාකරු භාවිතා කරන්නේ නම් , ඔබට පළමු ව්‍යාජ නොවන අගය ලැබේ:

var result = a || b || c || d || e || f; // result === 1

මෙහි පළ කර ඇති පරිදි ඔබ සාමාන්‍ය සිසිලන ක්‍රමය භාවිතා කරන්නේ නම් , ඔබට ලැබෙනු ඇත c, එහි වටිනාකම ඇත:NaN

var result = coalesce(a,b,c,d,e,f); // result.toString() === 'NaN'

මේ දෙකම මට ගැලපෙන්නේ නැත . ඔබේ ලෝකයට වඩා වෙනස් විය හැකි මගේම කුඩා ලෝකය තුළ, නිර්වචනය නොකළ, ශූන්‍ය සහ NaN සියල්ලම “ශුන්‍ය-ඊෂ්” ලෙස මම සලකමි. එබැවින්, dසිසිලන ක්‍රමයෙන් ආපසු (ශුන්‍යය) ලබා ගැනීමට මම බලාපොරොත්තු වෙමි .

යමෙකුගේ මොළය මගේ මෙන් ක්‍රියා කරයි නම් සහ ඔබට බැහැර කිරීමට අවශ්‍ය NaNනම්, මෙම ක්‍රමය මඟින් එය ඉටු කරනු ඇත:

function coalesce() {
    var i, undefined, arg;

    for( i=0; i < arguments.length; i++ ) {
        arg = arguments[i];
        if( arg !== null && arg !== undefined
            && (typeof arg !== 'number' || arg.toString() !== 'NaN') ) {
            return arg;
        }
    }
    return null;
}

කේතය හැකිතාක් කෙටි කිරීමට අවශ්‍ය අයට, සහ පැහැදිළි බවක් නොමැති නම්, ඔබට @impinball යෝජනා කළ පරිදි මෙය භාවිතා කළ හැකිය. NaN කිසි විටෙකත් NaN ට සමාන නොවන බව මෙයින් ප්‍රයෝජන ගනී. ඔබට මෙහි වැඩිදුර කියවිය හැකිය: NaN NaN ට සමාන නොවන්නේ ඇයි?

function coalesce() {
    var i, arg;

    for( i=0; i < arguments.length; i++ ) {
        arg = arguments[i];
        if( arg != null && arg === arg ) { //arg === arg is false for NaN
            return arg;
        }
    }
    return null;
}

ජාවාස්ක්‍රිප්ට් හි නිශ්චිත අර්ථ දැක්වීම ගැන පරෙස්සම් වන්න. javascript හි "වටිනාකමක් නැත" යන්න සඳහා අර්ථ දැක්වීම් දෙකක් තිබේ. 1. ශූන්‍යය: විචල්‍යයක් ශුන්‍ය වූ විට, එයින් අදහස් වන්නේ එහි කිසිදු දත්තයක් නොමැති බවයි, නමුත් විචල්‍යය දැනටමත් කේතයේ අර්ථ දක්වා ඇත. මෙවැනි:

var myEmptyValue = 1;
myEmptyValue = null;
if ( myEmptyValue === null ) { window.alert('it is null'); }
// alerts

එවැනි අවස්ථාවකදී, ඔබේ විචල්‍යයේ වර්ගය ඇත්ත වශයෙන්ම වස්තුවකි. එය පරීක්ෂා කරන්න.

window.alert(typeof myEmptyValue); // prints Object

2. නිර්වචනය නොකළ: කේතයේ පෙර විචල්‍යයක් නිර්වචනය කර නොමැති විට සහ අපේක්ෂිත පරිදි එහි කිසිදු අගයක් අඩංගු නොවේ. මෙවැනි:

   if ( myUndefinedValue === undefined ) { window.alert('it is undefined'); }
   // alerts

එවැනි අවස්ථාවකදී, ඔබේ විචල්‍යයේ වර්ගය 'නිර්වචනය නොකළ' ය.

ඔබ වර්ගය පරිවර්තනය කරන සංසන්දනාත්මක ක්‍රියාකරු (==) භාවිතා කරන්නේ නම්, ජාවාස්ක්‍රිප්ට් මෙම හිස් අගයන් දෙකටම සමානව ක්‍රියා කරන බව සලකන්න. ඒවා අතර වෙනස හඳුනා ගැනීමට, සෑම විටම ටයිප්-දැඩි සංසන්දනාත්මක ක්‍රියාකරු (===) භාවිතා කරන්න.

ඔබේ පැහැදිලි කිරීම කියවීමෙන් පසු, AteAtes Goral හි පිළිතුර මඟින් ඔබ ජාවාස්ක්‍රිප්ට් හි C # හි සිදු කරන එකම මෙහෙයුම සිදු කරන්නේ කෙසේද යන්න සපයයි.

Umb ගම්බෝගේ පිළිතුර ශුන්‍යය පරීක්ෂා කිරීමට හොඳම ක්‍රමය සපයයි; කෙසේ වෙතත්, ජාවාස්ක්‍රිප්ට් හි ==එදිරිව එදිරිව වෙනස සටහන් කිරීම වැදගත් වන්නේ විශේෂයෙන් පරීක්ෂා කිරීම සහ / හෝ .===undefinednull

මෙහි පද දෙකක වෙනස ගැන හොඳ ලිපියක් තිබේ . මූලික වශයෙන්, ඔබ ==ඒ වෙනුවට භාවිතා කරන්නේ නම්, ඔබ ===සංසන්දනය කරන අගයන් ඒකාබද්ධ කිරීමට ජාවාස්ක්‍රිප්ට් උත්සාහ කරන අතර මෙම සමතුලිතතාවයෙන් පසුව සංසන්දනයේ ප්‍රති result ලය කුමක් දැයි ආපසු ලබා දෙන්න .

ඔව්, සහ එහි යෝජනාව වන්නේ අදියර 4 දැන්. මෙයින් අදහස් කරන්නේ විධිමත් ECMAScript ප්‍රමිතියට ඇතුළත් කිරීමට යෝජනාව සූදානම් බවයි. ඔබට දැනටමත් ක්‍රෝම්, එජ් සහ ෆයර්ෆොක්ස් හි මෑත ඩෙස්ක්ටොප් අනුවාද වල එය භාවිතා කළ හැකිය, නමුත් මෙම අංගය හරස් බ්‍රව්සර් ස්ථායිතාව කරා ළඟා වන තුරු අපට තව ටිකක් කල් බලා සිටීමට සිදුවනු ඇත.

එහි හැසිරීම නිරූපණය කිරීම සඳහා පහත උදාහරණය දෙස බලන්න:

// note: this will work only if you're running latest versions of aforementioned browsers
const var1 = undefined;
const var2 = "fallback value";

const result = var1 ?? var2;
console.log(`Nullish coalescing results in: ${result}`);

පෙර උදාහරණය සමාන වේ:

const var1 = undefined;
const var2 = "fallback value";

const result = (var1 !== null && var1 !== undefined) ?
    var1 :
    var2;
console.log(`Nullish coalescing results in: ${result}`);

බව සටහන එක් රැස්වෙමින් nullish ඇත නොහැකි තර්ජනයක් falsy අගයන් මාර්ගය ||ක්රියාකරු කළේ (එය පමණක් චෙක්පත් undefinedහෝ nullඅගයන්), පහත සඳහන් පරිදි ඒ නිසා පහත සඳහන් ඇබිත්ත ක්රියා කරනු ඇත:

// note: this will work only if you're running latest versions of aforementioned browsers
const var1 = ""; // empty string
const var2 = "fallback value";

const result = var1 ?? var2;
console.log(`Nullish coalescing results in: ${result}`);

ටයිප්ස්ක්‍රිප්ට් 3.7 සිට ටයිප්ස්ක්‍රිප්ට් භාවිතා කරන්නන් සඳහා , මෙම අංගය දැන් ලබා ගත හැකිය.

3.3.0 අනුවාදයේcreate-react-app සිට (නිකුත් කරන ලද 5.12.2019) සිට ප්‍රතික්‍රියාකාරක මෙවලම් දාමය ශුන්‍ය- සමතුලිතතාවයට සහාය වන බව සලකන්න . නිකුතු සටහන් වලින්:

විකල්ප දම්වැල් සහ අහෝසි කිරීමේ මෙහෙයුම්කරුවන්

අපි දැන් විකල්ප දම්වැල් සහ අහෝසි කිරීමේ ක්‍රියාකරුවන්ට සහාය දෙමු!

// Optional chaining
a?.(); // undefined if `a` is null/undefined
b?.c; // undefined if `b` is null/undefined

// Nullish coalescing
undefined ?? 'some other default'; // result: 'some other default'
null ?? 'some other default'; // result: 'some other default'
'' ?? 'some other default'; // result: ''
0 ?? 300; // result: 0
false ?? true; // result: false

මෙයින් create-react-appකියැවෙන්නේ, ඔබ 3.3.0+ භාවිතා කරන්නේ නම්, ඔබගේ ප්‍රතික්‍රියා යෙදුම්වල දැනටමත් ශුන්‍ය-සමතුලිත ක්‍රියාකරු භාවිතා කිරීම ආරම්භ කළ හැකිය.

එය 2020 අප්‍රේල් වන විට යෝජනා අවධියේ පවතින බැවින් එය ජාවාස්ක්‍රිප්ට් හි ඉතා ඉක්මනින් ලබා ගත හැකි වනු ඇතැයි අපේක්ෂා කෙරේ. ගැළපුම සහ සහාය සඳහා ඔබට මෙහි තත්වය නිරීක්ෂණය කළ හැකිය - https://developer.mozilla.org/en-US/docs/Web/ JavaScript / Reference / Operators / Nullish_coalescing_operator

යතුරු ලියනය භාවිතා කරන පුද්ගලයින් සඳහා, ඔබට ටයිප්ස්ක්‍රිප්ට් 3.7 වෙතින් ශුන්‍ය සිසිලන ක්‍රියාකරු භාවිතා කළ හැකිය

ලියකියවිලි වලින් -

මෙම අංගය ගැන ඔබට සිතිය හැකිය - ??ක්‍රියාකරු - සමඟ ගනුදෙනු කිරීමේදී nullහෝ පෙරනිමි අගයකට “ආපසු වැටීමේ” ක්‍රමයක් ලෙස undefined. අපි කේතය ලියන විට

let x = foo ?? bar();

අගය foo“පවතින විට” භාවිතා කරනු ඇතැයි කීමට මෙය නව ක්‍රමයකි ; නමුත් එය පැමිණි විට nullහෝ undefined, ගණනය bar()කි්රයා කෙළේය.

තාර්කික ශුන්‍ය පැවරුම, 2020+ විසඳුම

නව ක්‍රියාකරුවෙකු දැනට බ්‍රව්සර් වෙත එකතු වෙමින් පවතී ??=. මෙය ශුන්‍ය සිසිලන ක්‍රියාකරු ??පැවරුම් ක්‍රියාකරු සමඟ ඒකාබද්ධ කරයි =.

සටහන: මෙය තවමත් පොදු බ්‍රව්සර් අනුවාද වල සුලභ නොවේ . උපයෝජ්‍යතා වෙනස්වීම් ලෙස යාවත්කාලීන වේ.

??=විචල්‍යය නිර්වචනය කර නොමැතිද නැතිනම් කෙටි පරිපථයක් දැනටමත් අර්ථ දක්වා ඇත්නම් පරීක්ෂා කරයි. එසේ නොවේ නම්, දකුණු පැත්තේ අගය විචල්‍යයට පවරා ඇත.

මූලික උදාහරණ

let a          // undefined
let b = null
let c = false

a ??= true  // true
b ??= true  // true
c ??= true  // false

වස්තු / අරා උදාහරණ

let x = ["foo"]
let y = { foo: "fizz" }

x[0] ??= "bar"  // "foo"
x[1] ??= "bar"  // "bar"

y.foo ??= "buzz"  // "fizz"
y.bar ??= "buzz"  // "buzz"

x  // Array [ "foo", "bar" ]
y  // Object { foo: "fizz", bar: "buzz" }

බ්‍රව්සර් සහාය 2020 ජූලි - .03%

මොසිල්ලා ප්‍රලේඛනය

හරි පිළිතුරක් හරි

එය ජාවාස්ක්‍රිප්ට් වල තිබේද? ඔව්, එය එසේ වේ. ඒත්. එය දැනට 3 වන අදියරේදී 2020-02-06 වන විට සෑම තැනකම සහය නොදක්වයි. පහත URL හි ඇති සබැඳිය අනුගමනය කර එය ඇති ස්ථානය පිළිබඳ වැඩි විස්තර සඳහා "පිරිවිතර" සහ "බ්‍රව්සර් අනුකූලතා" ශීර්ෂයන් වෙත යන්න.

උපුටා ගැනීම: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator

ශුන්‍ය සිසිලන ක්‍රියාකරු (??) යනු තාර්කික ක්‍රියාකරු වන අතර එහි වම් පස ක්‍රියාකාරිත්වය ශුන්‍ය හෝ නිර්වචනය කර නොමැති විට එහි දකුණු පස ක්‍රියාකාරිත්වය නැවත ලබා දෙන අතර වෙනත් ආකාරයකින් එහි වම් පස ක්‍රියාකාරිත්වය නැවත ලබා දෙයි.

තාර්කික OR (||) ක්‍රියාකරුට පටහැනිව, වම් ඔපෙරන්ඩ් එක ආපසු හරවනු ලබන්නේ එය ව්‍යාජ අගයක් නම් එය ශුන්‍ය හෝ නිර්වචනය කර නොමැති බැවිනි. වෙනත් වචන වලින් කිවහොත්, ඔබ භාවිතා කරන්නේ නම් || වෙනත් විචල්‍ය foo එකකට යම් පෙරනිමි අගයක් ලබා දීම සඳහා, සමහර ව්‍යාජ අගයන් භාවිතා කළ හැකි යැයි ඔබ සලකන්නේ නම් ඔබට අනපේක්ෂිත හැසිරීම් වලට මුහුණ දීමට සිදුවනු ඇත (උදා: 'හෝ 0). තවත් උදාහරණ සඳහා පහත බලන්න.

උදාහරණ අවශ්‍යද? මා පළ කළ සබැඳිය අනුගමනය කරන්න, එයට සෑම දෙයක්ම තිබේ.

ක්‍රෝම්, එජ්, ෆයර්ෆොක්ස්, සෆාරි වැනි ප්‍රධාන බ්‍රව්සර් වල නවතම අනුවාදයට දැන් පූර්ණ සහය ලැබේ.

const response = {
        settings: {
            nullValue: null,
            height: 400,
            animationDuration: 0,
            headerText: '',
            showSplashScreen: false
        }
    };
    /* OR Operator */
    const undefinedValue = response.settings.undefinedValue || 'Default Value'; // 'Default Value'
    const nullValue = response.settings.nullValue || 'Default Value'; // 'Default Value'
    const headerText = response.settings.headerText || 'Hello, world!'; //  'Hello, world!'
    const animationDuration = response.settings.animationDuration || 300; //  300
    const showSplashScreen = response.settings.showSplashScreen || true; //  true
    /* Nullish Coalescing Operator */
    const undefinedValue = response.settings.undefinedValue ?? 'Default Value'; // 'Default Value'
    const nullValue = response.settings.nullValue ?? ''Default Value'; // 'Default Value'
    const headerText = response.settings.headerText ?? 'Hello, world!'; // ''
    const animationDuration = response.settings.animationDuration ?? 300; // 0
    const showSplashScreen = response.settings.showSplashScreen ?? true; //  false