js 对象和函数补充

JS对象补充(掌握)

    // 1) js没有字典类型,只有对象类型,对象可以完全替代字典来使用
    var dic_obj = {
        //属性:值(数值,函数)
        'name':'Bob',
        'eat':function () {
            console.log('在吃饭')
        }
    };

    console.log(dic_obj.name,dic_obj['name']);
    dic_obj.eat(); dic_obj['eat']();

    // 2) js中对象的属性名,都采用字符串类型,所以就可以省略字符串的引号标识
    var obj = {
        name: 'Tom',
        eat: function () {
            console.log('在吃饭...')
        }
    };

    console.log(obj.name,obj['name']);
    obj.eat();obj['eat']();

    // 3) 对象中属性值为函数时,称之为方法,方法建议简写 方法名(){}
    var obj2 = {
        name: 'Tom',
        eat () {
            console.log('在吃饭...')
        }
    };

    console.log(obj2.name,obj2['name']);
    obj2.eat();obj2['eat']();

    //4) 如果对象的属性值是一个变量,且变量名与属性名相同,还可以简写 {属性,}
    var height = 180;
    var p = {
        height,
        name: 'Jerry'
    };
    console.log(p.name,p.height);

声明类的方法(了解)

    //js中的类
    //第一种声明类的方法
    class People {
        constructor(name) {
            this.name = name
        }
        eat () {
            console.log(this.name + '在吃饭')
        }
    }
    let p1 = new People('Bob');
    let p2 = new People('Tom');
    console.log(p1.name,p2.name);
    p1.eat();

    // 第二种声明类的方法(难点):在函数内部出现this语法,该函数介绍类,否则就是普通函数
    function Teacher(name) {
        this.name = name;
        this.eat = function () {
            console.log(this.name + '在吃饭')
        }
    }

    let t1 = new Teacher('Owen');
    t1.eat();

类属性(掌握)

    // 类属性:给类属性赋值,所有对象都能访问
    function Fn() {}
    let f1 = new Fn();
    let f2 = new Fn();
    // 赋值类属性
    Fn.prototype.num = 100;

    console.log(f1.num);
    console.log(f2.num);

    // 类似于单例
    Vue.prototype.num = 1000;
    let v1 = new Vue();
    let v2 = new Vue();
    console.log(v1.num);
    console.log(v2.num);

JS函数补充

    // 1)函数的形参与调用时传入的实参关系(你传你的,我收我的)
    //      传入和接受的参数个数不需要一致,但是一定按位置进行赋值(没有关键字参数)
    //      没有接受的实参会被遗弃,没有被赋值的形参会被赋值为undefined
    function fn1(a,b) {
        return a + b;
    }

    let res = fn1(10,20);
    console.log(res);

    // 2)函数定义的演变
    let fn2 = function (a,b) {
        return a + b;
    };

    // 省略关键字的箭头函数
    let fn3 = (a,b) => {
        return a + b
    };

    // 没有函数体,只有返回值的函数,可以省略作用域{},由于只有返回值,所以return也省略
    let fn4 = (a,b) => a + b;
    console.log(fn4(11,22));

    // 如果形参只有一个时,声明参数的()也可以省略
    let fn5 = num => num * num;
    console.log(fn5(3));

    // js是弱语言类型
    console.log(10 + '5');  // 105
    console.log(10 - '5');  // 5
    console.log(+'55555');  // 数字55555
原文地址:https://www.cnblogs.com/baohanblog/p/12297261.html