Accessor is an abstract class that facilitates the access to instance properties as well as a mechanism to watch for property changes. Every sub-class of Accessor defines properties that are directly accessible or by using the get() and set() methods. It is possible to watch for a property changes by using the watch() method.
Property Overview
Name | Type | Summary | Class | |
---|---|---|---|---|
String | more details The name of the class. | more details | Accessor |
Property Details
-
declaredClass StringreadonlySince: ArcGIS API for JavaScript 4.7
-
The name of the class. The declared class name is formatted as
esri.folder.className
.
Method Overview
Name | Return Type | Summary | Class | |
---|---|---|---|---|
Accessor | more details Creates a subclass of the class calling this method. | more details | Accessor | |
* | more details Gets the value of a property. | more details | Accessor | |
more details Adds one or more handles which are to be tied to the lifecycle of the object. | more details | Accessor | ||
* | more details Sets the value of a property. | more details | Accessor | |
WatchHandle | more details Watches for property changes on the instance. | more details | Accessor |
Method Details
-
Since: ArcGIS API for JavaScript 4.21
-
Creates a subclass of the class calling this method.
Parameter:classDefinition ObjectAn object with properties and methods to mix in to the newly created class.
Returns:Type Description Accessor Returns a constructor of the newly created class.
-
get(path){*}
-
Gets the value of a property.
The name of the property can refer to a property in the instance. For more information, see the Working with properties Guide topic.
view.get("scale");
It can also be a path to a property deeper in the instance.
get()
returnsundefined
if a property in the path doesn't exist.let title = map.get("basemap.title"); // equivalent of let title = map.basemap && map.basemap.title || undefined;
Parameter:path StringThe path of the property to get.
Returns:Type Description * The property's value.
-
own(handleOrHandles)Since: ArcGIS API for JavaScript 4.24
-
Adds one or more handles which are to be tied to the lifecycle of the object. The handles will be removed when the object is destroyed.
// Manually manage handles const handle = reactiveUtils.whenOnce(() => !view.updating) .then(() => { wkidSelect.disabled = false; }); handle.remove(); // Assign a handle using own() this.own(reactiveUtils.whenOnce(() => !view.updating) .then(() => { wkidSelect.disabled = false; }));
Parameter:handleOrHandles WatchHandle|WatchHandle[]Handles marked for removal once the object is destroyed.
-
set(path, value){*}
-
Sets the value of a property.
Call
set()
with a property name and a value to change the value of the property.// setting the basemap of the map map.set("basemap", "topo-vector"); // is equivalent to map.basemap = "topo-vector"; // currying set let updateViewScale = view.set.bind(view, "scale"); updateViewScale(5000);
set()
can be called with the path to a property and a value. The property is not set if a property in the path doesn't exist.// updating the title of the basemap map.set("basemap.title", "World Topographic Map"); // is equivalent to if (map.basemap != null) { map.basemap.title = "World Topographic Map"; }
An object with key-value pairs may be passed into
set()
to update multiple properties at once.// setting a viewpoint on the view view.set({ center: [-4.4861, 48.3904], scale: 5000 }); // currying set let updateView = view.set.bind(view); updateView({ center: [-4.4861, 48.3904], scale: 5000 });
Parameters:The path to the property to set, or an object of key-value pairs
value *The new value to set on the property.
Returns:Type Description * The instance.
-
watch(path, callback){WatchHandle}
-
Watches for property changes on the instance. For additional capabilities when observing changes on properties, see reactiveUtils.
Watching for property changes is essential for tracking changes on objects. To start watching for changes on a property, call
watch()
with the property name and a callback function that will execute each time the property changes.let handle = mapview.watch("scale", function(newValue, oldValue, propertyName, target) { console.log(propertyName + " changed from " + oldValue + " to " + newValue); });
To stop watching for changes, call the
remove()
method on the object thatwatch()
returns.handle.remove();
It is important to store the resulting objects from
watch()
to properly clean up the references.let viewHandles = []; function setView(view) { // remove the handles for the current view. viewHandles.forEach(function(handle) { handle.remove(); }); viewHandles.length = 0; this.view = view; // watch for properties on the newly set view. if (view) { viewHandles.push( view.watch("scale", scaleWatcher); ); } } setView(mapView); setView(null);
Like
get()
andset()
, it is possible to watch for a property deep in the object hierarchy by passing a path. If a property in the path doesn't exist the watch callback is called withundefined
.let view = new SceneView({ map: new Map({ basemap: "streets-vector" }) }); view.watch("map.basemap.title", (newValue, oldValue) => { console.log("basemap's title changed from " + oldValue + " to " + newValue); }); view.map.basemap = "topo-vector"; // output: "basemap's title changed from Streets to Topographic" view.map = null; // output: "basemap's title changed from Topographic to undefined"
Pass a comma delimited list of property paths, or an array of property paths, to watch multiple properties with the same callback. Use the third parameter of the callback call to determine what property changed.
view.watch("center, scale, rotation", (newValue, oldValue, propertyName) => { console.log(propertyName + " changed"); }); // equivalent of view.watch(["center", "scale", "rotation"], (newValue, oldValue, propertyName) => { console.log(propertyName + " changed"); }); // equivalent of let callback = (newValue, oldValue, propertyName) => { console.log(propertyName + " changed"); } view.watch("center", callback); view.watch("scale", callback); view.watch("rotation", callback);
Accessor
doesn't call the watch callbacks for a property immediately after its value changes. Instead, when a property's value changes and if that property is watched,Accessor
schedules a notification which is then processed at a later time. Properties that change frequently likeview.scale
can be watched without having to throttle the callback.// Divides the view.scale three times view.watch("scale", (newValue, oldValue) => { console.log("view's scale changed from " + oldValue + " to " + newValue); }); console.log("current view scale: " + view.scale); view.scale = view.scale / 2; view.scale = view.scale / 2; view.scale = view.scale / 2; console.log("current view scale: " + view.scale); // output the following: // current view scale: 36978595.474472 // current view scale: 4622324.434309 // view's scale changed from 36978595.474472 to 4622324.434309
Parameters:The property or properties to watch. Multiple properties can be specified as a comma-separated list.
callback watchCallbackThe callback to execute when the property value has changed.
Returns:Type Description WatchHandle A watch handle - See also:
-
- reactiveUtils - provides additional capabilities when observing properties.
Type Definitions
-
watchCallback(newValue, oldValue, propertyName, target)
-
Callback to be called when a watched property changes.
Parameters:newValue *The new value of the watched property.
oldValue *The old value of the watched property.
propertyName StringThe property name.
target AccessorThe object containing the property being watched.
-
WatchHandle Object
-
Represents a watch or event handler which can be removed.
- Property:
-
remove Function
Removes the watch handle.
Example:let handle = reactiveUtils.watch(() => map.basemap, (newVal) => { // Each time the value of map.basemap changes, it is logged in the console console.log("new basemap: ", newVal); }); // When remove() is called on the watch handle, the map no longer watches for changes to basemap handle.remove();