Apakah 6 kaedah definisi pembolehubah dalam es6

青灯夜游
Lepaskan: 2023-01-29 19:10:59
asal
2094 orang telah melayarinya

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.

Apakah 6 kaedah definisi pembolehubah dalam es6

Persekitaran pengendalian tutorial ini: sistem Windows 7, ECMAScript versi 6, komputer Dell G3.

6 cara untuk mengisytiharkan pembolehubah dalam es6


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;
Salin selepas log masuk
  • Skop pembolehubah yang diisytiharkan oleh var ialah global atau tahap fungsi.
  • Pembolehubah yang ditakrifkan oleh var boleh diubah suai Jika tidak dimulakan, undefined akan dikeluarkan dan tiada ralat akan dilaporkan.
  • Pembolehubah yang diisytiharkan oleh var adalah pada tetingkap Gunakan let atau const untuk mengisytiharkan pembolehubah ini tidak akan diletakkan pada tetingkap.
  • Banyak bahasa mempunyai skop peringkat blok, tetapi JS tidak menggunakan var untuk mengisytiharkan pembolehubah dan menggunakan fungsi (ia juga boleh dikatakan menggunakan kurungan kerinting '{ }') untuk membahagikan skop, tetapi kurungan kerinting "{ }" tidak boleh mengehadkan skop var, jadi pembolehubah yang diisytiharkan dengan var mempunyai kesan promosi pembolehubah.

(2) arahan fungsi

function add(a) {
  var sum = a + 1;
  return sum;
}
Salin selepas log masuk
  • mengisytiharkan pembolehubah baharu bernama add dan Ia diberikan fungsi takrifan. Kandungan antara
  • { } ditugaskan untuk ditambah.
  • Kod di dalam fungsi tidak akan dilaksanakan serta-merta apabila diisytiharkan, tetapi hanya disimpan dalam pembolehubah untuk kegunaan masa hadapan.

(3) perintah kos

const a;     //报错,必须初始化
const b = 1; 
b = 2;      //报错,TypeError: Assignment to constant variable.
Salin selepas log masuk
  • const mentakrifkan pemalar dan mesti dimulakan.
  • Penunjuk pemalar yang diisytiharkan dengan kata kunci const tidak boleh ditukar . Apa yang dikatakan di sini ialah penunjuk tetap tidak boleh berubah, tetapi nilai ruang memori yang ditunjuk oleh penunjuk boleh berubah.
    Contohnya:
const obj = {};
obj.n = 123;
obj; // { n: 123 }
obj = { x: 1 }; // TypeError: Assignment to constant variable.
Salin selepas log masuk

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-ubah

console.log(a);  //ReferenceError: a is not defined
let a = "apple";
 
console.log(b);  //undefined
var b = "banana";
Salin selepas log masuk
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.

Pembolehubah a diisytiharkan dengan let dan tiada promosi pembolehubah Sebelum mengisytiharkan pembolehubah a, a tidak wujud, jadi ralat akan dilaporkan.

Pengisytiharan pendua tidak dibenarkan

let a = 1;
let a = 2;
var b = 3;
var b = 4;
a  // Identifier 'a' has already been declared
b  // 4
Salin selepas log masuk
biar hanya boleh diisytiharkan sekali, var boleh diisytiharkan beberapa kali

Sekat- skop tahap ( Iaitu, ia hanya sah dalam satu { })

{
  let a = 0;
  a   // 0
}
a   // 报错 ReferenceError: a is not defined
Salin selepas log masuk
Selepas definisi let digunakan di dalam fungsi, ia tidak mempunyai kesan pada bahagian luar fungsi

Anda 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
Salin selepas log masuk

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";
}
Salin selepas log masuk

(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';
Salin selepas log masuk

上面的代码表示从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');
Salin selepas log masuk

类的传参

在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());
Salin selepas log masuk

class的继承

class的继承就是用extends

class shuang extends Coder{
 }
 let shuang=new shuang;shuang.name('Angel爽');
Salin selepas log masuk

声明一个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!

Label berkaitan:
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