AngularJS未定义或为null


80

当我编写手表处理函数时,我会在undefined和上检查newVal参数null。为什么AngularJS具有这种行为,却没有特定的实用程序方法?所以有angular.isUndefined但没有angular.isUndefinedOrNull。手动实现并不难,但是如何扩展角度以在每个控制器中具有该功能?Tnx。

编辑

这个例子:

$scope.$watch("model", function(newVal) {
    if (angular.isUndefined(newVal) || newVal == null) return;
    // do somethings with newVal
}

处理这种方法是否普遍接受?

编辑2

JSFiddle示例(http://jsfiddle.net/ubA9r/):

<div ng-app="App">
  <div ng-controller="MainCtrl"> 
      <select ng-model="model" ng-options="m for m in models">
          <option value="" class="ng-binding">Choose model</option>
      </select>
      {{model}}
  </div>
</div>

var app = angular.module("App", []);

var MainCtrl = function($scope) {
    $scope.models = ['Apple', 'Banana'];
    $scope.$watch("model", function(newVal) {
        console.log(newVal);
    });
};

1
您可以切换到coffeescript。有一个问号postifix运算符可以做到这一点。
Patryk Ziemkowski

当您需要这种功能时,能否请您提供真实的案例?
Stepan Suvorov

3
为什么不丢掉未定义的支票而只是支票newVal == null
David Sherret 2014年

3
因为(newVal === null)如果newVal未定义,则返回false。
Greg Dougherty'2

是的,newVal === null将是错误的,但newVal == null将是真实的。大卫是正确的。
Patrick McElhaney

Answers:


160

您始终可以为您的应用程序完全添加它

angular.isUndefinedOrNull = function(val) {
    return angular.isUndefined(val) || val === null 
}

我知道以这种方式扩展js库并不总是很好,但它看起来非常接近我的搜索。实际上,我对为什么坚持下去更感兴趣。在监视处理程序中处理未定义和null是否是标准做法?
slo2ols

好吧,恕我直言,在结构良好的应用程序中,不应出现此类情况。
Stepan Suvorov

知道了,谢谢。但是我仍然认为“ null”是正确选择的结果,应该将其与“ undefined”区分开。
Stepan Suvorov

24
@STEVER为什么在结构良好的应用程序中“ null”会不好?例如,如果仅在用户登录时才用用户数据填充变量,则null是登录之前和注销之后的正确值。
RonLugge 2014年

17

我对您的建议是编写您自己的实用程序服务。您可以在每个控制器中包括该服务,也可以创建一个父控制器,将实用程序服务分配给您的作用域,然后每个子控制器都将继承该服务,而不必将其包括在内。

示例:http//plnkr.co/edit/NI7V9cLkQmEtWO36CPXy?p = preview

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope, Utils) {
    $scope.utils = Utils;
});

app.controller('ChildCtrl', function($scope, Utils) {
   $scope.undefined1 = Utils.isUndefinedOrNull(1);  // standard DI
   $scope.undefined2 = $scope.utils.isUndefinedOrNull(1);  // MainCtrl is parent

});

app.factory('Utils', function() {
  var service = {
     isUndefinedOrNull: function(obj) {
         return !angular.isDefined(obj) || obj===null;
     }

  }

  return service;
});

或者,您也可以将其添加到rootScope中。您可以使用自己的实用程序功能扩展角度的几种方法。


4
我坚信效用函数不应该是DI
slo2ols

@ slo2ols封装它,您可以创建服务并将其仅注入到roo
lucuma 2014年

14

不久前,我问了lodash维护者相同的问题,他们回答说!=可以在这里使用运算符:

if(newVal != null) {
  // newVal is defined
}

这使用JavaScript的类型强制转换来检查undefined或的值null

如果您使用JSHint整理代码,请添加以下注释块以告诉您您知道自己在做什么-大多数情况下,这!=被认为是不好的。

/* jshint -W116 */ 
if(newVal != null) {
/* jshint +W116 */
  // newVal is defined
}

9

为什么不简单地使用angular.isObject否定?例如

if (!angular.isObject(obj)) {
    return;
}

...但是如果您知道该值是什么类型并可以选择一种angular.isX匹配的方法,则是一个不错的选择。
Phasmal

null是一个对象
Spicekimchi

isObject文档中:返回:如果value是,则返回true ,Object但不是null
DerMike

7

@STEVER的答案是令人满意的。但是,我认为发布稍微不同的方法可能很有用。我使用一种称为isValue的方法,该方法对除null,undefined,NaN和Infinity之外的所有值返回true。用null和undefined混入NaN是该功能的真正好处。用null和undefined组合Infinity更具争议性,但是坦率地说,对于我的代码而言,这不是那么有趣,因为我几乎从不使用Infinity。

以下代码受Y.Lang.isValue的启发。这是Y.Lang.isValue的来源

/**
 * A convenience method for detecting a legitimate non-null value.
 * Returns false for null/undefined/NaN/Infinity, true for other values,
 * including 0/false/''
 * @method isValue
 * @static
 * @param o The item to test.
 * @return {boolean} true if it is not null/undefined/NaN || false.
 */
angular.isValue = function(val) {
  return !(val === null || !angular.isDefined(val) || (angular.isNumber(val) && !isFinite(val)));
};

或作为工厂的一部分

.factory('lang', function () {
  return {
    /**
     * A convenience method for detecting a legitimate non-null value.
     * Returns false for null/undefined/NaN/Infinity, true for other values,
     * including 0/false/''
     * @method isValue
     * @static
     * @param o The item to test.
     * @return {boolean} true if it is not null/undefined/NaN || false.
     */
    isValue: function(val) {
      return !(val === null || !angular.isDefined(val) || (angular.isNumber(val) && !isFinite(val)));
  };
})

为什么不替换val === null || !angular.isDefined(val)为just val == null
J.Steve

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.