Rumah > Artikel > hujung hadapan web > Cara baharu untuk mencipta objek javascript Object.create()_javascript kemahiran

Cara baharu untuk mencipta objek javascript Object.create()_javascript kemahiran

WBOYasal: 2016-05-16 15:22:531297semak imbas

Apakah itu Object.create()?
Object.create(proto [, propertiesObject ]) ialah kaedah penciptaan objek baharu yang dicadangkan dalam E5 Parameter pertama ialah prototaip yang akan diwarisi Jika ia bukan sub-fungsi, anda boleh melepasi null parameter Parameter ialah deskriptor atribut bagi objek Parameter ini adalah pilihan.
Contohnya:

function Car (desc) {
  this.desc = desc;
  this.color = "red";
}
 
Car.prototype = {
  getInfo: function() {
   return 'A ' + this.color + ' ' + this.desc + '.';
  }
};
//instantiate object using the constructor function
var car = Object.create(Car.prototype);
car.color = "blue";
alert(car.getInfo());

Hasilnya ialah:Biru tidak ditentukan.

1. Penjelasan terperinci tentang propertiesObject parameter: (lalai adalah palsu)
Atribut data:

boleh ditulis: sama ada ia boleh ditulis sewenang-wenangnya
boleh dikonfigurasikan: sama ada ia boleh dipadamkan dan sama ada ia boleh diubah suai
boleh dikira: sama ada ia boleh dikira menggunakan untuk dalam
nilai: nilai

Akses sifat:

get(): akses
set(): Set

2. Contoh: Lihat sahaja contoh untuk mengetahui cara menggunakannya.

<!DOCTYPE html>
<html>
<head>
  <title>yupeng's document </title>
  <meta charset="utf-8"/>
</head>
<body>
  <script type="text/javascript">

    var obj = {

      a:function(){
        console.log(100)
      },
      b:function(){
        console.log(200)
      },
      c:function(){
        console.log(300)
      }

    }

    var newObj = {};

    newObj = Object.create(obj,{
      t1:{
        value:'yupeng',
        writable:true
      },
      bar: {
        configurable: false,
        get: function() { return bar; },
        set: function(value) { bar=value }
      }
      
    })

    console.log(newObj.a());
    console.log(newObj.t1);
    newObj.t1='yupeng1'
    console.log(newObj.t1);
    newObj.bar=201;
    console.log(newObj.bar)
    
    function Parent() { }
    var parent = new Parent();
    var child = Object.create(parent, {
       dataDescriptor: {
        value: "This property uses this string as its value.",
        writable: true,
        enumerable: true
       },
       accessorDescriptor: {
        get: function () { return "I am returning: " + accessorDescriptor; },
        set: function (val) { accessorDescriptor = val; },
        configurable: true
       }
      });

    child.accessorDescriptor = 'YUPENG';
    console.log(child.accessorDescriptor);



    var Car2 = function(){
      this.name = 'aaaaaa'
    } //this is an empty object, like {}
    Car2.prototype = {
     getInfo: function() {
      return 'A ' + this.color + ' ' + this.desc + '.';
     }
    };

    var newCar = new Car2();
     
    var car2 = Object.create(newCar, {
     //value properties
     color:  { writable: true, configurable:true, value: 'red' },
     //concrete desc value
     rawDesc: { writable: true, configurable:true, value: 'Porsche boxter' },
     // data properties (assigned using getters and setters)
     desc: { 
      configurable:true, 
      get: function ()   { return this.rawDesc.toUpperCase(); },
      set: function (value) { this.rawDesc = value.toLowerCase(); } 
     }
    }); 
    car2.color = 'blue';
    console.log(car2.getInfo());
    car2.desc = "XXXXXXXX";
    console.log(car2.getInfo());
    console.log(car2.name);



  </script>
</body>
</html>

Hasilnya ialah:
100
yupeng
yupeng1
201
Saya kembali: YUPENG
Sebuah BOXTER PORSCHE berwarna biru
Biru XXXXXXXX
aaaaa

Di atas ialah pengenalan terperinci kepada Object.create(), kaedah penciptaan objek baharu dalam JavaScript saya harap ia akan membantu pembelajaran semua orang.

Kenyataan：

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel sebelumnya：Gunakan OpenLayers3 untuk menambah kemahiran menu_javascript klik kanan petaArtikel seterusnya：Gunakan OpenLayers3 untuk menambah kemahiran menu_javascript klik kanan peta

Artikel berkaitan

Lihat lagi