Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > Apakah penggunaan simbol dalam es6

Apakah penggunaan simbol dalam es6

WBOY
Lepaskan: 2022-04-25 18:27:11
asal
1935 orang telah melayarinya

Dalam es6, Simbol boleh digunakan sebagai nama atribut, pembolehubah yang ditakrifkan atau pemalar untuk mewakili nilai unik. Dua pembolehubah yang diisytiharkan melalui Simbol tidak boleh sama : "const name=Symbol("value")".

Apakah penggunaan simbol dalam es6

Persekitaran pengendalian tutorial ini: sistem Windows 10, ECMAScript versi 6.0, komputer Dell G3.

Apakah penggunaan simbol dalam es6

Apakah Simbol?

Simbol ialah jenis data yang baru ditambah dalam es6, yang mewakili nilai keunikan . Dalam es5, kami membahagikan jenis data kepada jenis data asas (rentetan, nombor, Boolean, tidak ditentukan, nol) dan jenis data rujukan (Objek Jenis data Simbol baharu dalam es6 dibahagikan kepada jenis data asas

Sebab). adakah terdapat jenis data sedemikian?

//别人给了你一个定义好的对象
var obj = {
    name: "xiaoqiang",
    showName: function(){alert(1)}
}
//你拿到对象想给这对象添加新的属性和方法的时候,可能会创建出一个name属性和showName方法
obj.name = "nodeing"
obj.showName = function(){alert(2)}

//这个时候,新增加的方法和属性就会去把原有的方法覆盖,这样就产生了冲突
Salin selepas log masuk

Memandangkan sifat dan kaedah objek terdiri daripada rentetan, mungkin terdapat konflik apabila menambahkan kaedah dan sifat baharu dalam es6, jenis data baharu ditambahkan untuk mewakili nilai unik

Nilai unik boleh dibuat melalui fungsi Simbol Setiap kali fungsi Simbol dilaksanakan, objek dikembalikan

let s1 = Symbol()
let s2 = Symbol()

console.log(s1 === s2) //false 说明创建出来的s1和s2 并不是相同的
console.log(s1, s2); //Symbol() Symbol()
Salin selepas log masuk

Dalam kod di atas, nilai yang dicetak adalah semua Simbol(), Bagaimana. bolehkah kita bezakan siapa s1 dan siapa s2? Kita boleh menyelesaikan masalah ini dengan menghantar parameter

//传入的参数就是对当前Symbol的描述,用来区分Symbol
let s1 = Symbol("s1")
let s2 = Symbol("s2")
console.log(s1, s2);  //Symbol(s1) Symbol(s2)
Salin selepas log masuk

senario aplikasi

Simbol biasanya digunakan untuk menetapkan nama sifat atau kaedah objek. Elakkan atribut atau kaedah yang baru ditambah daripada bercanggah dengan atribut atau kaedah asal

let name = Symbol("name");
let show = Symbol("show");

let obj = {
    //设置属性
    [name]: 'xiaoqiang',
    [show](){alert(1)}
};
//取值
console.log(obj[name]);
//调用方法
obj[show]()
Salin selepas log masuk

Perlu diperhatikan di sini bahawa nilai nama mestilah dalam [] untuk menunjukkan bahawa ia adalah pembolehubah yang boleh diubah

Nota

Nota 1: Parameter dalam Simbol hanyalah perihalan Simbol dan tidak mempunyai makna lain oleh itu, walaupun huraian adalah sama, Simbol adalah berbeza

Di sini. anda boleh meneka kembalinya fungsi Simbol Nilai ialah objek

console.log(Symbol("nodeing") === Symbol("nodeing")) //false
Salin selepas log masuk

Nota 2: Fungsi Simbol tidak boleh dipanggil menggunakan kata kunci Baharu

let s1 = new Symbol(); //报错
Salin selepas log masuk

Nota 3: Simbol jenis tidak boleh ditukar kepada nombor semasa penukaran jenis

let s1 = Symbol("s1");
console.log(String(s1));  //Symbol(s1)
console.log(Boolean(s1));  //true
console.log(Number(s1)) //报错
Salin selepas log masuk

Nota 4: Simbol tidak boleh melakukan sebarang operasi (mungkin nilai pulangan tidak boleh dikendalikan)

console.log(Symbol("s1") + "nodeing") //报错
console.log(Symbol("s1") - 100) //报错
Salin selepas log masuk

Nota 5: Apabila Simbol digunakan sebagai atribut atau kaedah objek, jika ia tidak diberikan kepada Untuk pembolehubah, tiada cara untuk mendapatkan nilai

let obj = {
    //设置属性
    [Symbol("name")]: 'xiaoqiang'
};
//取值
console.log(obj[Symbol("name")]);
Salin selepas log masuk

Nota 6: Simbol tidak boleh dilalui oleh untuk dalam gelung

let name = Symbol('name')
let age = Symbol('age')
let obj = {
    a: 1,
    b: 2,
    [name]: 'xiaoqiang',
    [age]: 18
};
for(let attr in obj){
    console.log(attr,obj[attr])  //a b
}
Salin selepas log masuk

Anda boleh menggunakan Object.getOwnPropertySymbols untuk melihat semua sifat simbol pada objek

console.log(Object.getOwnPropertySymbols(obj))
Salin selepas log masuk

[Cadangan berkaitan: tutorial video javascript, bahagian hadapan web ]

Atas ialah kandungan terperinci Apakah penggunaan simbol dalam es6. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
es6
sumber:php.cn
Kenyataan Laman Web ini
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan