ホームページ > 記事 > ウェブフロントエンド > 3 分で Object.defineProperty() メソッドを理解できます
3 分で Object.defineProperty() メソッドを理解できます
- 醉折花枝作酒筹転載
- 2021-04-23 09:11:311926ブラウズ
この記事では、Object.defineProperty() メソッドについて詳しく説明します。一定の参考値があるので、困っている友達が参考になれば幸いです。
#構文
Object.defineProperty(obj, prop, descriptor)定義
オブジェクトに新しい属性を定義し、元の属性を変更します。パラメータ
obj ターゲット オブジェクト。 prop 定義または変更するプロパティの名前。 descriptor 定義または変更されたプロパティ記述子。 (value、writable、get、set の値は同時に設定できません)
属性記述子
設定可能: ブール値--> 可能ですか? Configurationenumerable: Boolean--> 列挙可能かどうかvalue: デフォルト値writable: Boolean-->オーバーライドできるかどうか/アクセス (アクセス) 記述子
get //コールバック関数は他の属性に基づいて現在の属性の値を動的に計算しますset //コールバック関数は現在の属性を監視し、値が変化するかどうかを監視し、他の関連プロパティを更新します。
戻り値
操作対象のオブジェクトを返します。つまり、obj パラメータを返します。次のコードは単純な実装です。双方向データ バインディング:<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<input type="text" id="ipt" />
<p id="lc"></p>
</body>
</html>
<script>
//获取页面元素
var ipt = document.getElementById("ipt");
var ps = document.getElementById("lc");
var obj = { name: "" };
Object.defineProperty(obj, "name", {
get() {
return ipt.value;
},
set(newval) {
ipt.value = newval;
ps.innerHTML = newval;
},
});
ipt.addEventListener("keyup", function() {
ps.innerHTML = ipt.value; //数据赋值
});
</script> エフェクト画像の表示:
# #[推奨される学習:
以上が3 分で Object.defineProperty() メソッドを理解できますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事はcsdn.netで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。