前端内容补充

变量提升,在作用域内声明的变量在外部可以使用,var会将变量的声明提到全局

{var a = 12; // 局部变量的声明
      console.log(a);}  //12
    console.log(a+1);  //13

在ES6里新增了局部变量声明和常量声明

var a  = 1;
{let a = 12; // 局部变量的声明
  console.log(a);} //12
console.log(a+1); //2

const b=5;  //常量声明,不可被修改

ES6的字符串可以使用替换

<script>
    var url = "www.baidu,com";
    console.log(`<a href="${url}">百度</a>`) //${变量名}
</script>

// <a href="www.baidu,com">百度</a>

函数声明

function add1(a,b) {
        console.log(a+b);
    }
var add2 = function (a,b) {
        console.log(a+b);
    };
// 箭头函数
var add3 = (a,b)=>{ console.log(a+b); }; add1(1,2); //3 add2(1,2); //3 add3(1,2); //3

面向对象

<script>
// 字面量方式声明
var person = {
        name: "日天", // 键可以带引号,也可不带引号
        age:18,
        fav1:function(){console.log(this)},
        //使用箭头函数会改变this的指向,指向了父级元素
        fav2: ()=> {console.log(this)}
       };
person.fav1(); // {name: "日天", age: 18, fav1: ƒ, fav2: ƒ}
person.fav2(); //Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, frames: Window, …}



// 对象的单体模式
   var person2 = {
        name: "ritian",
        fav(){ // 相当于fav:function(){}
            console.log(this)
        }
    };
person2.fav(); // {name: "ritian", fav: ƒ}


// 构造函数,建议首字母大写
function Animal(name,age) {
        this.name = name;
        this.age = age;
        this.fav = function () {
          console.log(this)
        }
    }
var a = new Animal("日天",18);
console.log(a.name,a.age); // 日天 18
a.fav(); // Animal {name: "日天", age: 18, fav: ƒ}

// 空对象
var a = new Object();
a.name = "日天";
a.age = 18;

// 构造函数+空对象
function Person(name,age) {
        var obj = new Object();
        obj.name = name;
        obj.age = age;
        obj.fav = function () {
          console.log(this)
        };
        return obj
    }
a = Person("日天",18);
console.log(a.name);  // 日天
a.fav()  // {name: "日天", age: 18, fav: ƒ}


//prototype向类添加新的方法或属性
function Animal(name,age) {
        this.name = name;
        this.age = age;
        this.fav = function () {

        }
    }
    Animal.prototype.showName = function () {
        console.log(this)
    };
var a = new Animal("yuan", 18);
console.log(a.age); // 18
a.showName(); //Animal {name: "yuan", age: 18, fav: ƒ}
<script>

ES6中新增了class方式

class Animal{
        constructor(name="yuan",age=13){ // 默认值
            this.name = name;
            this.age = age;
        }
        showName(){
            console.log(this)
        }
    }

var a = new Animal();
a.showName() // Animal {name: "yuan", age: 13}

  

posted @ 2018-04-02 20:00  瓜田月夜  阅读(82)  评论(0)    收藏  举报