ES6学习

之前面试了几家公司,其中有一半问了我,是否了解ES6。所以,ES6,我来学习啦~~~

先推荐两个网站,其他...再说,边学边写吧~~

阮一峰的博客:http://es6.ruanyifeng.com/     ( 这是一个超级大神,网站上是他的电子版的书。大家有条件的话一定要多支持!!等我毕业挣钱了我也支持(・-・。) )

一个学习网站,个人感觉很不错,从头开始学起,还不允许跳着看,适合我这种不踏实的人看(捂脸):http://www.(把我删了)hubwiz.com/course/5594e91ac086935f4a6fb8ef/


1. 注意,ES6的script标签的type属性的值是module(或者traceur),而不是text/javascript。这是Traceur编译器识别ES6代码的标识,编译器会自动将所有type=module的代码编译为ES5,然后再交给浏览器执行。

2. let是ES6中新增关键字。它的作用类似于var,用来声明变量,但是所声明的变量,只在let命令所在的代码块内有效。(之前的一旦声明改变就永远变掉了) 现在for循环可以直接用let声明。

var a = [];
for (let i = 0; i < 10; i++) {
    a[i] = function () {
      document.write(i);
    };
}
a[6](); // 6

var a = [];
for (var i = 0; i < 10; i++) {
    a[i] = function () {
      document.write(i);
    };
}
a[6](); // 10

3. const 声明的是常量,一旦声明,值将是不可变的。(不仅如此,而且 const 不可重复声明,重复声明会报错)。const 也具有块级作用域。

if(true){
    const a = 5;
    document.write(a);   //5
}
document.write('-------------');
document.write(a);   //无值

 4. ES6又提供了三种新方法。

includes():返回布尔值,表示是否找到了参数字符串。

startsWith():返回布尔值,表示参数字符串是否在源字符串的头部。

endsWith():返回布尔值,表示参数字符串是否在源字符串的尾部。

而原js只有一个indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。(indexOf() 方法对大小写敏感!)若存在即为0及以上的index位置,不存在即为-1。

var str = "Hello world!";

document.write(str.indexOf("Hello") + "<br />");      //0
document.write(str.indexOf("World") + "<br />");      //-1
document.write(str.indexOf("world"));                 //6

document.write(str.startsWith("Hello"));              //true
document.write(str.endsWith("!"));                    //true
document.write(str.includes("o"));                    //true

上述方法都支持第二参数,endsWith 的行为与其他三个方法有所不同,它针对前n个字符,而其他两个方法针对从第n个位置直到字符串结束。

5. repeat()返回一个新字符串,表示将原字符串重复n次。

var str1 = "hello";
str1.repeat(2);        // "hellohello"

6. 模板字符中,支持字符串插值:

let first = 'hubwiz';
let last = '汇智网';
document.write(`Hello ${first} ${last}!`);     // Hello hubwiz 汇智网!

模板字符串可以包含多行:

let multiLine = `
    This is
    a string
    with multiple
    lines`;
    document.write(multiLine);    //This is a string with multiple lines

tag函数。整个表达式的返回值,就是tag函数处理模板字符串后的返回值。

var a = 5;
var b = 10;
 
function tag(s, v1, v2) {
  document.write(s[0]);    // "Hello "
  document.write(s[1]);    // " world "
  document.write(v1);      // 15
  document.write(v2);      // 50
 
  return "OK";
}
 
tag`Hello ${ a + b } world ${ a * b}`;     //tag中的参数为 1.本身自带的明确存在的‘Hello world’  2.第一个${}中的内容,即15  3.第二个${}中的内容,即50

7. String.raw()

ES6还为原生的String对象,提供了一个raw方法。若使用String.raw 作为模板字符串的前缀,则模板字符串可以是原始(raw)的。反斜线也不再是特殊字符,  也不会被解释成换行符:

let raw = String.raw`Not a newline: 
`;
document.write(raw === 'Not a newline: \n');    // true

8. ES6在Number对象上,新提供了Number.isFinite()和Number.isNaN()两个方法,用来检查Infinite和NaN这两个特殊值。

Number.isFinite()用来检查一个数值是否非无穷(infinity)。

Number.isFinite(15); // true
Number.isFinite(0.8); // true
Number.isFinite(NaN); // false
Number.isFinite(Infinity); // false
Number.isFinite(-Infinity); // false
Number.isFinite("foo"); // false
Number.isFinite("15"); // false
Number.isFinite(true); // false

Number.isNaN()用来检查一个值是否为NaN。

Number.isNaN(NaN); // true
Number.isNaN(15); // false
Number.isNaN("15"); // false
Number.isNaN(true); // false

Number.isInteger()用来判断一个值是否为整数。需要注意的是,在JavaScript内部,整数和浮点数是同样的储存方法,所以3和3.0被视为同一个值。

Number.isInteger(25) // true
Number.isInteger(25.0) // true
Number.isInteger(25.1) // false
Number.isInteger("15") // false
Number.isInteger(true) // false

9. 师父告诉我,这个项目要兼用IE8,暂时ES6会放在一边,之后有空继续~~未完待续~

原文地址:https://www.cnblogs.com/neuscx/p/5214248.html