如果在JavaScript中为null或未定义,则替换值

时间:2009-06-18 07:44:46

标签: javascript

我要求将?? C#运算符应用于JavaScript,我不知道如何运行。 在C#中考虑这个:

int i?=null;
int j=i ?? 10;//j is now 10

现在我在JavaScript中设置了这个:

var options={
       filters:{
          firstName:'abc'
       } 
    };
var filter=options.filters[0]||'';//should get 'abc' here, it doesn't happen
var filter2=options.filters[1]||'';//should get empty string here, because there is only one filter

我该如何正确地做到这一点?

感谢。

编辑:我发现问题的一半:我不能对对象(my_object[0])使用'indexer'表示法。有没有办法绕过它? (我事先不知道过滤器属性的名称,也不想迭代它们。)

6 个答案:

答案 0 :(得分:219)

这是JavaScript的等价物:

var i = null;
var j = i || 10; //j is now 10

请注意,logical operator ||不会返回布尔值,而是可以转换为 true 的第一个值。

另外,使用一个对象数组而不是一个对象:

var options = {
    filters: [
        {
            name: 'firstName',
            value: 'abc'
        }
    ]
};
var filter  = options.filters[0] || '';  // is {name:'firstName', value:'abc'}
var filter2 = options.filters[1] || '';  // is ''

可以通过索引访问。

答案 1 :(得分:8)

ES2020答案

新的Nullish Coalescing运算符终于可以在JavaScript上使用,尽管浏览器支持受到限制。根据{{​​3}}的数据,截至2020年4月,仅支持48.34%的浏览器。

根据文档

无效的合并运算符(??)是一个逻辑运算符, 当其左侧操作数为时,返回其右侧操作数 null或undefined,否则返回其左侧操作数。

const options={
  filters:{
    firstName:'abc'
  } 
};
const filter = options.filters[0] ?? '';
const filter2 = options.filters[1] ?? '';

如果''filters[0]filters[1]null,这将确保两个变量的后备值均为undefined

请注意,虚空合并运算符不会为其他类型的伪造值(例如0'')返回默认值。如果要考虑所有虚假值,则应使用OR运算符||

答案 2 :(得分:6)

  

我发现问题的一半:我不能对对象使用'indexer'表示法(my_object [0])。有没有办法绕过它?

没有;顾名思义,对象文字是对象,而不是数组,因此您不能简单地根据索引检索属性,因为它们的属性没有特定的顺序。检索其值的唯一方法是使用特定名称:

var someVar = options.filters.firstName; //Returns 'abc'

或者使用for ... in循环迭代它们:

for(var p in options.filters) {
    var someVar = options.filters[p]; //Returns the property being iterated
}

答案 3 :(得分:5)

逻辑无效分配,2020年以上的解决方案

已添加新的运算符Fiscal Purchase Index = VAR a = 'Purchases'[Purchase_Date] VAR b = 'Purchases'[Entity_ID] var c = 'Purchases'[FISCAL_YEAR] RETURN CALCULATE ( RANKX ('Purchases', a,,1,Dense ), FILTER (all('Purchases'), 'Purchases'[Entity_ID] = b && 'Purchases'[FISCAL_YEAR] = c ) ) 。这等效于??=

value = value ?? defaultValue||=相似,链接如下。

这将检查左侧是否未定义或为null,如果已定义则短路。如果不是,则为左侧分配右侧值。

基本示例

&&=

对象/数组示例

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

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

// Equivalent to
a = a ?? true

功能示例

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" }

??= Browser Support 2020年11月-77%

??= Mozilla Documentation

||= Mozilla Documentation

&&= Mozilla Documentation

答案 4 :(得分:1)

解构解决方案

问题内容可能已更改,所以我将尝试彻底回答。

通过解构,您可以从具有属性的任何事物中提取值。您还可以定义null / undefined和名称别名时的默认值。

const options = {
    filters : {
        firstName : "abc"
    } 
}

const {filters: {firstName = "John", lastName = "Smith"}} = options

// firstName = "abc"
// lastName = "Smith"

注意:大写很重要

如果使用数组,请按以下步骤操作。

在这种情况下,将从数组中的每个对象中提取名称,并为其指定别名。由于该对象可能不存在,因此还添加了= {}

const options = {
    filters: [{
        name: "abc",
        value: "lots"
    }]
}

const {filters:[{name : filter1 = "John"} = {}, {name : filter2 = "Smith"} = {}]} = options

// filter1 = "abc"
// filter2 = "Smith"

More Detailed Tutorial

Browser Support到2020年7月为92%

答案 5 :(得分:0)

?? 应该优先于 ||,因为它只检查空值和未定义

以下所有表述均正确:

(null || 'x') === 'x' ;
(undefined || 'x') === 'x' ;
//Most of the times you don't want the result below
('' || 'x') === 'x'  ;
(0 || 'x') === 'x' ;
(false || 'x') === 'x' ;
//-----

//Using ?? is preferred
(null ?? 'x') === 'x' ;
(undefined ?? 'x') === 'x' ;
//?? works only for null and undefined, which is in general safer
('' ?? 'x') === '' ;
(0 ?? 'x') === 0 ;
(false ?? 'x') === false ;

底线:

int j=i ?? 10; 也非常适合在 javascript 中使用。只需将 int 替换为 let

Asterisk:选中 browser compatibility,如果您真的需要支持这些其他浏览器,请使用 babel