What is the usage of has() in es6?

WBOY
Release: 2022-04-26 11:06:08
Original
3699 people have browsed it

In es6, the has() method is used to intercept HasProperty operations and can also be used to hide certain properties; this method serves as the in operator of the function and returns a Boolean value indicating whether there is a self-owned or inherited Attributes, the syntax is "Reflect.has (target object to find attributes, attributes to be checked)".

What is the usage of has() in es6?

The operating environment of this tutorial: Windows 10 system, ECMAScript version 6.0, Dell G3 computer.

What is the usage of has() in es6

has is used as the in operator of the function. It returns a Boolean value indicating whether there is a self-owned or inherited attribute.

The syntax of the function has() is given below, where

  • target is the target object in which the attribute is to be found.

  • propertyKey is the name of the property to be checked.

Reflect.has(target, propertyKey)
Copy after login

has() method is used to intercept the HasProperty operation, that is, when determining whether the object has a certain attribute, this method will take effect. A typical operation is the in operator.

The has() method can accept two parameters, namely the target object and the attribute name to be queried.

Use the has() method to hide certain attributes from being discovered by the in operator.

var handler = {
  has(target, key) {
    if (key[0] === "_") {
      return false;
    }
    return key in target;
  },
};
var target = { _prop: "foo", prop: "foo" };
var proxy = new Proxy(target, handler);
"_prop" in proxy; // false
Copy after login

If the first character of the original object's attribute name is an underscore, proxy.has() will return false and will not be discovered by the in operator.

If the original object is not configurable or expansion is prohibited, has() interception will report an error.

var obj = { a: 10 };
Object.presentExtensions(obj);
var p = new Proxy(obj, {
  has: function(target, prop) {
    return false;
  },
});
"a" in p; // TypeError is thrown
Copy after login

In the above code, the obj object is prohibited from expansion, and as a result, an error will be reported if has is used to intercept it. That is, if a property is not configurable (or the target object is not extensible), the has() method must not "hide" (i.e. return false) the property of the target object.

It is worth noting that the has() method intercepts the HasProperty operation, not the HasOwnProperty operation, that is, the has() method does not determine whether a property is the object's own property or an inherited property.

In addition, although the for...in loop also uses the in operator, has() interception does not take effect on the for...in loop.

let stu1 = { name: "lily", score: 59 };
let stu2 = { name: "lucy", score: 99 };
let handler = {
  has(target, prop) {
    if (prop === "score" && target[prop] < 60) {
      console.log(`${target.name} 不及格`);
      return false;
    }
    return prop in target;
  },
};
let oproxy1 = new Proxy(stu1, handler);
let oproxy2 = new Proxy(stu2, handler);
"score" in oproxy1;
// lily 不及格
// false
"score" in oproxy2;
// true
for (let a in oproxy1) {
  console.log(oproxy1[a]);
}
// lily
// 59
for (let b in oproxy2) {
  console.log(oproxy2[b]);
}
// lucy
// 99
Copy after login

In the above code, has() interception only takes effect for the in operator and not for the for...in loop, resulting in attributes that do not meet the requirements not being excluded by the for...in loop.

【Related recommendations: javascript video tutorial, web front-end

The above is the detailed content of What is the usage of has() in es6?. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
es6
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template