es5,es6

严格模式:

在全局或函数的第一条语句定义为:'use strict';

    <script type="text/javascript">

        'use strict';

    </script>

语法和行为的改变:

必须用var声明变量

        var username = 'kobe';

        console.log(username);

禁止自定义的函数中的this指向window

        function Person(name,age) {

            this.name = name;

            this.age = age;

        }

        new Person('kobe',40);

创建eval作用域

        var str = 'NBA';

        eval('alert(str)');//alert直接被调用 能够解析传进来的字符串 如果是JS代码是能够执行的

        eval('var str = "CBA";alert(str)');//使用严格模式 //不会污染全局的str

        alert(str);//不使用严格模式的话 打印的都是cba //eval没有自己的作用域

对象不能有重名的属性

        var obj = {

            username: 'kobe',

            //username: 'wade' 属性不能重名

        }

JSON对象:

1.JSON.stringify(对象或数组)js对象(数组)转换为json对象(数组)

var obj = {username:'kobe'};

        obj = JSON.stringify(obj);//js传换成json

2.JSON.parse(对象或数组)json对象(数组)转换为js对象(数组)

obj = JSON.parse(obj);//json转换js

Object扩展:

1.Object.create(prototype,[descriptors])

以指定对象为原型创建新的对象

为新的对象指定新的属性,并对属性进行描述

value:指定值

writable:标识当前属性值是否是可修改的,默认为false

configurable:标识当前属性是否可以被删除 默认为false

enumerable:标识当前属性是否能用 for in 枚举 默认为false

        var obj = {username:'jordan',age: 55};

        var obj1 = {};

        obj1 = Object.create(obj,{

            sex: {

                value:'男',

                writable: true,//默认为false不能修改 我们把它改为true

                configurable:true,//默认为false不能删除 我们把它改为true

                enumerable:true//默认为false不能枚举 我们把它改为true

            }

        }); //还可以添加配置对象,扩展属性

        console.log(obj1);//打印结果为Object展开后下边有一个隐式原型__proto__: age:55 username:"jordan",也是一个对象

        obj1.sex = '女';//修改属性

        delete obj1.sex;//删除属性

        console.log(obj1.sex);//可以直接调用

        for(var i in obj1){

            console.log(i);

        }//并没有把sex枚举出来,然后在create方法中把enumerabler属性改为true;

2.Object.defineProperties(object,descriptors)

为指定对象定义扩展多个属性

get:用来获取当前属性值的回调函数

set:修改当前属性值的触发的回调函数,并且实参即为修改后的值

存取器属性:setter,getter一个用来存值,一个用来取值

var obj2 = {firstName:'kobe',lastName:'bryant'};

        Object.defineProperties(obj2,{//扩展属性

            fullName:{//添加配置对象

                get:function () {//获取扩展属性的值

                    return this.firstName + " " + this.lastName;

                },//相关描述和配置

                set:function (data) {//监听扩展属性,当属性发生变化,会自动调用

                    //将变化的值作为实参传入

                    console.log('set()',data);

                    var names = data.split(" ");

                    this.firstName = names[0];

                    this.lastName = names[1];

                }

            }

        });

        console.log(obj2);

        var obj3 = {

            firstName:'stephen',

            lastName:'curry',

            get fullName(){

                return this.firstName + " " + this.lastName;

            },

            set fullName(data){

                var names = data.split(" ");

                this.firstName = names[0];

                this.lastName = names[1];

            }

        };

Array扩展:

1.Array.prototype.indexOf(value):得到值在数组中的第一个下标

var arr = [2,4,6,6,2,3,1];

        console.log(arr.indexOf(2));//查看2出现第一次的下标

2.Array.prototype.lastIndexOf(value):得到值在数组中的最后一个下标

console.log(arr.lastIndexOf(2));//查看2出现最后一次的下标

3.Array.prototype.forEach(function(item,index){}):遍历数组

arr.forEach(function (item,index) {

            console.log(item,index)

        });//遍历元素和对应的下标

4.Array.prototype.map(function(item,index){}):

遍历数组返回一个新的数组,返回加工之后的值

var arr1 = arr.map(function (item,index) {

            return item + 10;

        });

        console.log(arr1);

5.Array.prototype.filter(function(item,index){}):

遍历过滤出一个新的子数组,返回条件为true的值

var arr2 = arr.filter(function (item,index) {

            return item > 3;//返回大于三的新数组

        });

        console.log(arr,arr2);

Function扩展:

1.Function.prototype.bind(obj):

将函数内的this绑定为obj,并将函数返回

var obj = {username: 'kobe'};

        function foo(data) {

            console.log(this,data);

        }

        foo.call(obj,33);

        foo.apply(obj,[33]);

        foo.bind(obj,33)();

2.bind()与call()和apply()的区别:

都能指定函数中的this

call()/apply()是立即调用函数

bind()是将函数返回

let关键字:

1.作用:与var类似,用于声明一个变量

let username = 'kobe';

        //不能重复声明,会报错

        for(let i = 0; i<btns.length;i++){//使用let取下标

            var btn = btns[i];

            btn.oncilck = function () {

                alert(i)

            }

        }

2.特点:在块作用域内有效,不能重复声明,不会提前预解析

3.应用:循环遍历加监听,取代var是趋势

const关键字:

1.作用:定义一个常量

const KEY = 'NBA';

2.特点:不能修改,其他特点同let

3.应用:保存不能改变的数据

变量的解构赋值:

1.从对象或数组中提取数据,并赋值给多个变量

2.对象的解构赋值:let {n,a} = {n:'tom',a:12}

let obj = {username:'kobe',age:40};

        let {username,age} = obj;//等于let username = obj.username; let age = obj.age;

        //要求:对象必须是以有属性

3.数组的解构赋值:let [a,b] = [1,'hello']

        let arr = [1,3,5,'abc,true'];

        let [a,b,c,d,e] = arr;//分别取到五个值

        let [a,b] = arr;//根据下标位置取

        let [,,a,b] = arr;//逗号占位,取到5,abc

4.用途:给多个形参赋值

模板字符串:

1.简化字符串的拼接,使用``包含,变化的部分使用${xxx}定义

let obj = {username:'kobe',age:40};

        let str = `我的名字叫:${obj.username},我的年龄:${obj.age}`;

        console.log(str);

简化的对象写法:

1.省略同名的属性值,省略方法的function

let username = 'kobe'

        let age = 40;

        let obj = {

            username,

            age,

            getName() {

                return this.username;

            }

        }

箭头函数:

作用,定义匿名函数:() => console.log('xxx')

一个参数:i => i + 2

大于一个参数:(i,j) => i+j

函数体不能用大括号:默认返回结果

函数体如果有多个语句,需要用{}包围,需要手动返回

用来定义回调函数

let fun = () => console.log('箭头函数');

        fun();

        //没有形参的时候括号不能省略

        let fun1 = () => console.log('箭头函数');

        //只有一个形参可以省略括号

        let fun2 = (a) => console.log(a);

        //两个以上的时候 不能省略括号

        let fun3 = (x,y) => console.log(x,y);

        //函数体只有一条语句或表达式{}可以省略 会自动返回执行结果

        let fun4 = (x,y) => x + y;

        console.log(fun4(24.23));

        //函数体不止一条语句,手动返回结果

        let fun5 = (x,y) => {

            console.log(x,y);

            return x + y;

        }

3点运算符:

rest参数: 用来取代arguments 只能在形参最后使用

function foo(...value) {

            console.log(arguments)

        }

        foo(2,3,4,5);

        let arr = [1,6];

        let arr2 = [2,3,4,5];

        arr = [1,...arr1,6];//把arr2插入到arr中

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,590评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 86,808评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,151评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,779评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,773评论 5 367
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,656评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,022评论 3 398
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,678评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 41,038评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,659评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,756评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,411评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,005评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,973评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,203评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,053评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,495评论 2 343

推荐阅读更多精彩内容