fundamentals\javascript\Angular读书笔记

目录

    • 概述
    • 概览
    • 模块
        • 常见模块分类
    • 组件
        • 组件
        • 模板语言
        • 绑定
            • 事件绑定
            • 管道
            • 指令
    • 服务……
    • 路由……
    • 补充资料
        • 一切皆是对象
        • 对象创建
        • 构造方法与对象
        • 继承
        • 原型

概述

fundamentals\javascript\Angular读书笔记_第1张图片

概览

fundamentals\javascript\Angular读书笔记_第2张图片

模块

fundamentals\javascript\Angular读书笔记_第3张图片

常见模块分类

fundamentals\javascript\Angular读书笔记_第4张图片

组件

组件

fundamentals\javascript\Angular读书笔记_第5张图片

模板语言

fundamentals\javascript\Angular读书笔记_第6张图片

绑定

fundamentals\javascript\Angular读书笔记_第7张图片

事件绑定

fundamentals\javascript\Angular读书笔记_第8张图片

管道
指令

服务……

路由……

补充资料

一切皆是对象

比如在 javaScript 中 var name = “mario” 是一个原始数据类型,它没有属性和方法。但是当我们调用 name.length 时 javascript 能自动的将原始类型包装成对象。

对象创建

var userOne = {
    email: '[email protected]',
    name: 'Ryu'login() {
   	 console.log(this.email, 'has logged in');
    },
    logout() {
   	 console.log(this.email, 'has logged out');
    }
}

构造方法与对象

使用 {} 可以创建对象,但是我们想要让对象的属性和方法被封装在对象内部,并且不暴露给外部
使用 ES6 新语法 class,自动创建 user_constructor 的 this 对象,用来封装对象属性,自动挂载方法到原型链

class User {
    constructor(email, name) {
   	 this.email = email;
   	 this.name = name;
   	 this.score = 0;
    }
    login() {
   	 console.log(this.email, 'has logged in');
   	 // return this 实现方法链
   	 return this;
    }
    logout() {
   	 console.log(this.email, 'has logged out');
   	 return this;
    }
    updateScore() {
   	 this.score++;
   	 console.log(this.email, 'score is now', this.score);
   	 return this;
    }
}
var userOne = new User('[email protected]', 'Ryu');

继承

创建一个 管理员 用户

class Admin extends User {
   constructor(x, y) {
   	super(x, y);
   	this.users = [];
   }
   deleteUser(user) {
   	this.users = this.users.filter(u => {
   		return u.email != user.email;
   	});
   }
}

原型

function User(email, name) {
    this.email = email;
    this.name = name;
    this.online = false;
    //this.login = function() {
   	 //console.log(this.email, 'has logged in');
    //}
}

每个对象都有 Prototype,定义类型的 object 有,类型创建的对象的 prototype 挂载到 类型 object 的 prototype 上
fundamentals\javascript\Angular读书笔记_第9张图片

function User(email, name) {
    this.email = email;
    this.name = name;
    this.online = false;
}
User.prototype.login = function() {
    this.online = true;
    console.log(this.email, 'has logged in');
}
 User.prototype.logout = function() {
    this.online = false;
    console.log(this.email, 'has logged out');
}
function Admin(...args) {
    User.apply(this, args);
    this.role = 'super admin';
    this.users = [];
}
Admin.prototype = Object.create(User.prototype);
Admin.prototype.deleteUser = function (user) {
    this.users = this.users.filter( u => {
   	 return u.email != user.email;
    });
}

你可能感兴趣的:(java)