目錄
一,定義變數let(類似var)" >一,定義變數let(類似var)
二,const 宣告一個常數" >二,const 宣告一個常數
 
三,字串的擴充" >三,字串的擴充
四, 5.0模板語法:`模板字串`" >四, 5.0模板語法:`模板字串`
五,6.0箭頭函數:( )=>{}" >五,6.0箭頭函數:( )=>{}
首頁 web前端 js教程 ES6的文法詳解

ES6的文法詳解

Sep 11, 2017 am 11:48 AM
詳解 文法

一,定義變數let(類似var)

在js一直有一個bug是var:

1、var 宣告的變數會有變數提升


console.log(name);  //jhonvar name = 'jhon';
登入後複製

2、var 沒有區塊級作用域


var name2 = 'jjjon';
{    var name2 = 'tom';
}
console.log(name2);     //tom
登入後複製

3、var 可以重複定義一個變量,後面的變數取代前面變數


var name3 = 'jond';var age = 18;var name3 = 19;var name3 = 'rose';
console.log(name3);     //rose
登入後複製

新的定義變數let:

#1、let宣告的變數不會有變數提升,只有在前面定義了在後面才能用


console.log(name4);     //报错let name4 = '1112';
登入後複製

2、let存在區塊級作用域


let name5 = '222';
{
    let name5 = ' ttt';
}
console.log(name5);  //222
登入後複製

3、let不能重複定義一個變數


let name6 = 'aa';
let name6 = 'bb';    //报错console.log(name6);  //aa
登入後複製

二,const 宣告一個常數

常數:指的是不會改變的資料

1、值不能再改變 


const pi = 3.01415;//pi = 3;     //报错
    {
        const arr = [5,6,8,9,];
        arr.push(7);
        console.log(arr);  //(5) [5, 6, 8, 9, 7]
        arr = 10;     //值不能改变,否则报错
    }
登入後複製

 

2、常數具有區塊級作用域


#
{
    const ban = "vin";
}
console.log(ban);     //报错
登入後複製

3、沒有變數提升,先宣告後再使用


console.log(ba);     //报错const ba = 'liu';
登入後複製

4、不能宣告同名的常數

5、一定要賦初始值,否則報錯


const bb;     //报错
登入後複製

6、如果宣告的是對象,物件的位址不能改變,但是可以改變其內部的屬性


const obj = {
    na:"jjjj",
    age:20};
console.log(obj.na);  //jjjjobj.na = "ccs";
console.log(obj.na);  //ccs
登入後複製

 

 例如:套用場景,固定的位址就可以用常數


// var path = 1122// var path = '1243';const path = 'path';
console.log(path);  //path
登入後複製

 

三,字串的擴充

1、判斷字串"hello word"是否存在"word"


#
var str = 'hello word';var result = str.indexOf('word');
console.log(result);  //6
登入後複製

 2,ES6提供includes():傳回布林值,用來判斷字串是否包含某些字元


var bool = str.includes('word');
console.log(bool);    //true
登入後複製

3,startsWith(str[,num]):傳回布林值,用於判斷字串是否以某個字元開頭


 bool2 = str.startsWith('hello'
登入後複製

//給這個方法傳入2個參數
var bool3 = str.startsWith('word',6);
console.log(bool3);  //true

#4,endsWith(str[,num]):傳回布林值,用於判斷字串是否以某些字元結尾


var bool4 = str.endsWith('d');
console.log(bool4);  //true//给这个方法传入两个参数var bool5 = str.endsWith('o',7);
console.log(bool5);  //false
登入後複製

5,repeat(num):傳入數字,這個方法將字串重複數字對應次數


var str322= '我爱我家,\n';
console.log(str322.repeat(3));        //3行 我爱我家,
登入後複製

 

四, 5.0模板語法:`模板字串`


var obj33 = {
    name:'zhuzhu',
    age:18,
    sex:'男',
    hobby:'女',
    veight:120,
    height:180};// 字符串拼接方法var str4 = '大家好,我叫:'+obj33.name+',今年'+obj33.age+',性别'+obj33.sex+',爱好'+obj33.hobby+'。';
console.log(str4);        //大家好,我叫:zhuzhu,今年18,性别男,爱好女。// 但是字符串的拼接太麻烦了,有没有简单的方法来解决这个问题呢,有的,模板字符串就可以了var temp111 = `大家好,我叫${obj33.name},今年${obj33.age},性别${obj33.sex},爱好${obj33.hobby}`;
console.log(temp111);    //大家好,我叫zhuzhu,今年18,性别男,爱好女//1,可以是变量let name8 = "美女";
let temp22 = `我叫${name8}`;
console.log(temp22);    //我叫美女// 2,可以是方法function getName(){    return "宝宝";
}
let temp3 = `我叫${getName()}`;
console.log(temp3);        //我叫宝宝// 3,可以是表达式let aa = 1 ;
let bb = 2;
let temp4 = `a + b=${aa+bb}`;
console.log(temp4);        //a + b=3
登入後複製

 

五,6.0箭頭函數:( )=>{}


// 最原始函数var arr = [2,3,5,7];
 $(arr).each(function(index,item){
   console.log(item);
 }); // 箭头函数改造// 改造一:匿名函数中的funtion关键字我们可以省略,参数与方法体之间中=>$(arr).each((index,item)=>{console.log(item);})
 // 改造二:如果方法体中的代码只有一句我们可以去掉{},并且代码结尾的分号要去掉$(arr).each((index,item) =>console.log(item));
登入後複製

以上是ES6的文法詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

Win11管理員權限取得詳解 Win11管理員權限取得詳解 Mar 08, 2024 pm 03:06 PM

Windows作業系統是全球最受歡迎的作業系統之一,其新版本Win11備受矚目。在Win11系統中,管理員權限的取得是一個重要的操作,管理員權限可以讓使用者對系統進行更多的操作和設定。本文將詳細介紹在Win11系統中如何取得管理員權限,以及如何有效地管理權限。在Win11系統中,管理員權限分為本機管理員和網域管理員兩種。本機管理員是指具有對本機電腦的完全管理權限

Oracle SQL中的除法運算詳解 Oracle SQL中的除法運算詳解 Mar 10, 2024 am 09:51 AM

OracleSQL中的除法運算詳解在OracleSQL中,除法運算是一種常見且重要的數學運算運算,用來計算兩個數相除的結果。除法在資料庫查詢中經常用到,因此了解OracleSQL中的除法運算及其用法是資料庫開發人員必備的技能之一。本文將詳細討論OracleSQL中除法運算的相關知識,並提供具體的程式碼範例供讀者參考。一、OracleSQL中的除法運算

linux系統呼叫system()函數詳解 linux系統呼叫system()函數詳解 Feb 22, 2024 pm 08:21 PM

Linux系統呼叫system()函數詳解系統呼叫是Linux作業系統中非常重要的一部分,它提供了一種與系統核心互動的方式。其中,system()函數是常用的系統呼叫函數之一。本文將詳細介紹system()函數的使用方法,並提供對應的程式碼範例。系統呼叫的基本概念系統呼叫是使用者程式與作業系統核心互動的一種方式。使用者程式透過呼叫系統呼叫函數來請求作業系統

PHP模運算子的作用及用法詳解 PHP模運算子的作用及用法詳解 Mar 19, 2024 pm 04:33 PM

PHP中的模運算子(%)是用來取得兩個數值相除的餘數的。在本文中,我們將詳細討論模運算子的作用及用法,並提供具體的程式碼範例來幫助讀者更好地理解。 1.模運算子的作用在數學中,當我們將一個整數除以另一個整數時,就會得到一個商和一個餘數。例如,當我們將10除以3時,商數為3,餘數為1。模運算子就是用來取得這個餘數的。 2.模運算子的用法在PHP中,使用%符號來表示模

Linux的curl指令詳解 Linux的curl指令詳解 Feb 21, 2024 pm 10:33 PM

Linux的curl命令詳解摘要:curl是一種強大的命令列工具,用於與伺服器進行資料通訊。本文將介紹curl指令的基本用法,並提供實際的程式碼範例,幫助讀者更好地理解和應用該指令。一、curl是什麼? curl是命令列工具,用於發送和接收各種網路請求。它支援多種協議,如HTTP、FTP、TELNET等,並提供了豐富的功能,如檔案上傳、檔案下載、資料傳輸、代

深入了解Promise.resolve() 深入了解Promise.resolve() Feb 18, 2024 pm 07:13 PM

Promise.resolve()詳解,需要具體程式碼範例Promise是JavaScript中一種用來處理非同步操作的機制。在實際開發中,常常需要處理一些需要依序執行的非同步任務,而Promise.resolve()方法就是用來傳回一個已經Fulfilled狀態的Promise物件。 Promise.resolve()是Promise類別的靜態方法,它接受一個

lambda 表達式的語法和結構有什麼特色? lambda 表達式的語法和結構有什麼特色? Apr 25, 2024 pm 01:12 PM

Lambda表達式是無名稱的匿名函數,其語法為:(parameter_list)->expression。它們具有匿名性、多樣性、柯里化和閉包等特徵。在實際應用中,Lambda表達式可用於簡潔地定義函數,如求和函數sum_lambda=lambdax,y:x+y,並透過map()函數應用於列表來進行求和操作。

numpy版本查詢方法詳解 numpy版本查詢方法詳解 Jan 19, 2024 am 08:20 AM

Numpy是一款Python科學計算庫,提供了豐富的陣列操作函數與工具。升級Numpy版本時需要查詢目前版本以確保相容性,本文將詳細介紹Numpy版本查詢的方法,並提供具體的程式碼範例。方法一:使用Python程式碼查詢Numpy版本使用Python程式碼可以輕鬆查詢Numpy的版本,以下是實作方法和範例程式碼:importnumpyasnpprint(np

See all articles