Enam kaedah definisi pembolehubah dalam es6: 1. Gunakan kata kunci var untuk mentakrifkan pembolehubah, sintaksnya ialah "var variable name = value;" 2. Gunakan fungsi kata kunci untuk menentukan pembolehubah; kata kunci const untuk mentakrifkan pembolehubah, sintaks "const variable name = value;"; pembolehubah; 6. Gunakan kelas kata kunci untuk menentukan pembolehubah.
Persekitaran pengendalian tutorial ini: sistem Windows 7, ECMAScript versi 6, komputer Dell G3.
es5 hanya menyediakan dua cara untuk mengisytiharkan pembolehubah, iaitu var dan fungsi.
Selain menambah arahan let dan const, ES6 juga mempunyai dua kaedah untuk mengisytiharkan pembolehubah: arahan import dan arahan kelas.
Jadi, ES6 mempunyai sejumlah 6 cara untuk mengisytiharkan pembolehubah iaitu var / function / let / const / import / class
(1) perintah var
var a ; //undefined var b = 1;
(2) arahan fungsi
function add(a) { var sum = a + 1; return sum; }
(3) perintah kos
const a; //报错,必须初始化 const b = 1; b = 2; //报错,TypeError: Assignment to constant variable.
const obj = {}; obj.n = 123; obj; // { n: 123 } obj = { x: 1 }; // TypeError: Assignment to constant variable.
const mengisytiharkan objek bernama obj Penunjuk obj menghala ke objek yang ditambahkan pada data objek. Data tidak mengubah alamat yang menunjuk ke objek yang disimpan dalam obj, jadi ia boleh dilaksanakan dengan jayanya Walau bagaimanapun, operasi menugaskan semula obj mengubah penunjuk obj, jadi operasi gagal dan ralat dilemparkan.
Perkara yang sama berlaku untuk jenis asas, kerana data jenis asas disimpan terus pada tindanan, dan nama pemalar terus menghala ke data di alamat ini Setelah nilai ditukar, alamat penuding akan berubah, jadi nilai tidak boleh diubah.
Pembolehubah ini ialah pembolehubah global, atau pembolehubah global dalam modul, dengan skop peringkat blok.
Jika pembolehubah diperuntukkan sekali sahaja apabila ia diisytiharkan dan tidak akan ditetapkan semula dalam baris kod lain, maka const harus digunakan, tetapi nilai awal pembolehubah mungkin Akan diselaraskan pada masa hadapan (pembolehubah malar).
Pembolehubah yang ditakrifkan tetap biasanya digunakan apabila memerlukan modul atau mentakrifkan beberapa pemalar global.
Pemalar tidak boleh mempunyai nama yang sama dengan pembolehubah atau fungsi lain dalam skopnya.
(4) biarkan perintah
memerlukan "mod ketat javascript": 'gunakan ketat';
----Tiada promosi berubah-ubahconsole.log(a); //ReferenceError: a is not defined let a = "apple"; console.log(b); //undefined var b = "banana";
Pembolehubah b diisytiharkan dengan var dan terdapat promosi berubah-ubah, jadi apabila skrip mula berjalan, b sudah wujud, tetapi mempunyai tidak diberikan nilai Jadi undefined akan menjadi output.Pengisytiharan pendua tidak dibenarkanPembolehubah a diisytiharkan dengan let dan tiada promosi pembolehubah Sebelum mengisytiharkan pembolehubah a, a tidak wujud, jadi ralat akan dilaporkan.
let a = 1; let a = 2; var b = 3; var b = 4; a // Identifier 'a' has already been declared b // 4
biar hanya boleh diisytiharkan sekali, var boleh diisytiharkan beberapa kaliSekat- skop tahap ( Iaitu, ia hanya sah dalam satu { })
{ let a = 0; a // 0 } a // 报错 ReferenceError: a is not defined
Selepas definisi let digunakan di dalam fungsi, ia tidak mempunyai kesan pada bahagian luar fungsiAnda boleh menetapkan nilai kepada pembolehubah apabila mengisytiharkannya , nilai lalai tidak ditentukan, anda juga boleh memberikan nilai kepada pembolehubah kemudian dalam skrip, ia tidak boleh digunakan sebelum pengisytiharan (zon mati sementara)
let a; console.log(a); // undefined console.log(b); // ReferenceError: b is not defined let b = 1; a = 2; console.log(a); // 2
Nota: ES6 dengan jelas menetapkan bahawa blok kod Jika terdapat let atau const dalam blok kod, pembolehubah yang diisytiharkan oleh arahan ini akan membentuk skop tertutup dari permulaan blok . Dalam blok kod, menggunakan PI pembolehubah sebelum mengisytiharkannya akan mengakibatkan ralat.
var PI = "a"; if(true){ console.log(PI); // ReferenceError: PI is not defined const PI = "3.1415926"; }
(5) perintah import
digunakan untuk memuatkan fail Apa yang diterima dalam kurungan kerinting ialah satu atau lebih banyak nama Pembolehubah, nama pembolehubah ini perlu sama dengan nama pembolehubah yang anda ingin import. import
举个栗子:你想要导入action.js文件中的某一个变量,这个变量里保存了一段代码块,所以你要写成:import { Button } from 'action'
,这个时候,你就从action.js中获取到了一个叫 Button 的变量,既然获取到了,你就可以对Button里的代码猥琐欲为了
如果想为输入的变量重新取一个名字,import
命令要使用as关键字,将输入的变量重命名,比如:
import { NewButton as Button } from 'action.js';
上面的代码表示从action.js文件中,获取一个变量名称叫做Button的代码段,然后你又声明了一个变量 NewButton ,将 Button 保存在 NewButton
(6) class命令
在es5中我们是使用构造函数实例化出来一个对象,那么构造函数与普通的函数有什么区别呢?其实没有区别,无非就是函数名称用首字母大写来加以区分,这个不用对说对es5有了解的朋友都应该知道。
但是es5的这种方式给人的感觉还是不够严谨,于是在es6中就换成了class,就是把es5中的function换成了class,有这个单词就代表是个构造函数,然后呢对象还是new出来的,这一点并没有变化。
类的使用
从里面的代码我们可以看到除了function变成了class以外,其它的跟es5一样
class Coder{ name(val){ console.log(val); }} let shuang= new Coder;shuang.name('shuang');
类的传参
在es6中的对象的属性都是写在constructor里面,方法都是在原型身上。在这里面的代码用constructor约定了两个参数,然后用add()方法把参数相加,这个地方跟以前不太一样,所以需要多注意一下。
class Coder{ name(val){ console.log(val); return val; } constructor(a,b){ this.a=a; this.b=b; } add(){ return this.a+this.b; }} let shuang=new Coder(1,2);console.log(shuang.add());
class的继承
class的继承就是用extends
class shuang extends Coder{ } let shuang=new shuang;shuang.name('Angel爽');
声明一个shuang的新类,用extends继承了Coder,调用里面的name方法,发现也是可以输出的。
一、用关键字var声明变量
1、var声明的全局对象是顶级对象(window)的属性;
2、用var在函数外声明的对象为全局变量,在函数内声明的对象为局部变量;
3、用var可以对同一对象重复声明和赋值;
4、用var声明的对象具有变量提升的作用(声明提前,赋值不提前);
二、用关键字function声明变量
1、用function声明的函数对象具有变量提升的作用(声明提前,赋值不提前);
2、function声明的函数对象是顶级对象(window)的属性;
三、用关键字let声明变量
1、用let声明的变量在块级作用域内有效;
2、let声明的变量不存在变量提升;
3、let声明的变量存在暂时性死区(即同一个块级作用域中,在let声明该变量的语句之前,该变量已经存在,但是不能使用);
4、在同一个作用域内,对于let声明的变量不能重复声明。
四、用关键字const声明变量
1、const命令声明的值一旦声明,就不能再次改变;
2、const声明变量时,必须立即初始化,否则会报错(因为值一旦声明不可改变);
3、const声明的变量不存在变量提升;
4、const声明的变量存在暂时性死区;
5、const声明的变量只在块级作用域内有效;
6、const变量在同一个作用域内不能重复声明。
五、关于变量提升
1、只有声明本身会被提升,而赋值操作不会被提升。
2、变量会提升到其所在函数的最上面,而不是整个程序的最上面。
3、函数声明会被提升,但函数表达式不会被提升。
4、函数声明的优先级高于普通变量申明的优先级,并且函数声明和函数定义的部分一起被提升。
5、同一个变量只会声明一次,其他的会被忽略掉。
【相关推荐:javascript视频教程、web前端】
Atas ialah kandungan terperinci Apakah 6 kaedah definisi pembolehubah dalam es6. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!