今天也是整理笔记，主要是MDN上学习。有一些地方写了连自己都看不懂，但还是可能会用到，逻辑很丑还请见谅。
本笔记DOM比较清楚、物件章节学得很乱，有误还请指教！

and明天谈谈送出给火箭队的履历。

其他

API - 浏览器的主要部分
window 窗口(载入浏览器的标籤)
navigator 用户代理(状态、标识)
document 文件(实际载入页面)

this 指向当前代码运行时的对象
原文: the curret object the code is written inside.

DOM

document.querySelector()　抓第一个>>变量document.querySelectorAll()　所有>>数组参数为Css选择器

*使用在旧浏览器上(不适用Dom.querySelector时)document.getElementById()　id作传递参数　document.getElementByTagName()　元素作传递参数document.getElementsByClassName 

document.createElement()　参数元素document.createTextNode("")　创建文本节点(#text节点)

Node.appendChild()　附加子节点至父节点(Node)末尾参数(子节点)可以为Css选择器、元素、变量也可以拿来做移动子节点(因为引用，非clone複製特性)Node.cloneNode()　複製节点

Node.removeChild()　删除子节点注意！以下为一个删除自身的办法（基于自身引用Node，自己无法删除自己）Node.parentNode.removeChild(Node)　即抓父节点(parentNode)删除自身

Node.textContent()Node应可以为Css选择器、元素、变量　(element.textContent())ex:para.textContent("Hi")

*操作样式*HTMLElement.styleex:　para.style.background = "red"         para.style.padding = "10px"

Element.setArribute()参数为("属性名称","值")，ex:　("class","redOne")、("id","shoppingCar")也可以空值ex: ("disabled", "")

Math

Math的两种传回整数方法

Math.ceil()　传回大于参数的整数Math.floor()　传回小于参数的整数

Event.target

事件对象e.target属性是刚刚发生事件的元素的引用

btn.addEventListner('click',bgchange) //btn即为事件对象bgchange()=e.target.style.background=randomcol()(经常使用在"多个元素"上设置"相同"事件处理程序)

preventDeffault()

preventDeffault()避免默认(程序)函数
ex:表单中用户输入错误－避免提交

冒泡、捕捉

冒泡 向上　video → div → html
捕捉 向下　html → div → video
依序检查 是否注册 事件处理程序

防止扩大(在事件处理程序中)

stopPropagation()// ex:(MDN範例，video(目前节点)点击播放、但div(父节点)到显示none)video.onclick = function(e){e.stopPropagation();video.play();};

事件委託

需要大量子元素任一可以运行一段代码时，
可将事件监听装在父节点上，
使子节点"冒泡"到父节点上，即不需要每个子节点都装事件监听器
ex:
在 ul 表单中拥有许多个 li 子元素，并且可能包含JS代码删除、增加等等，
此时即可只在 ul 上安装事件监听器，li则包含事件处理程序，
使点击(事件)任一 li 即可冒泡至 父节点 ul 上。

物件

对象包/命名空间 object package/namespace
存储/封装 对象的数据
对象也常用于作为数据存储体(data stores)以在网路上运输数据

也可以用括号表示法访问值(关联值的成员名)
ex: person["age"] =>32
可使用户在数据库里存储自定义的值、成员
let 成员 = input.value ex:height (表单)
let 值 = name.Value　 ex:1.75m (表单)
person["成员"] => 1.75m

以下对象、类，暂时不更改翻译问题

class

类 class－像是定义特质的模版
对象从类中创建，即类的构造函数运行创建此实例－实例化
(以下为类的创建、实例化、创建子类、实例子类)

目前先使用引用包为一个区块

ex:Class:Person{
Name[first,last]
Age
}
实例化
Object:Person1{
Name[Blight,Amity]
Age:18
}
也可基于其他类的创建新类－继承特质（父－子）
Class:Person{
Name[first,last]
Age
Greeting{"Hi! I'm [Name]."}
}
继承
Class:Teacher{
Name[first,last]
Age
Greeting{"Hello.My name is [Prefix]...，and I teach [Subject]."}
}
或是
Class:Student{
Name[first,last]
Age
Greeting{"Yo! I'm [Name]"}
}
再根据子类创造 (上述类)
Object:teacher1{
Name[Dave,Griffen]
Age
Greeting{"Hello.My name is Griffen...，and I teach math."}
}

构造函式

Object()构造函数
用new告知创建一个对象，类似功能调用例如：
var person1 = new Object ()，()内可放 {对象成员:"值"}
向此对象_添加属性_、方法例如：
person1.name="Chris"

create()方法
基于 现有对象 创建 新对象
var person2 = Object.create(person1)
有相同对象成员、属性、方法。

原型练

原型对象→对象原型链。
注意创建新对象（或类），不是複制特殊属性的人群。

都有一个特殊的属性叫原型(prototype)
_proto_从构造函数的prototype 属性派生（非複制）

找属性（properties）的过程，真实浏览器找一个属性
因无该属性，位置名单最终会找到doSomeIns函式的_pro_的_pro_的_pro_
（该函式的基础对象为doSomething式，又该函式的基础对象为window.Object）

第一个发现是doSomeIns函式内有无此属性，没找到往上_（对象）_第一个_proto_，doSomeIns的_proto_也就是doSomething.prototype，没找到往上第二个_proto_，doSomething的_proto_也就是window.Object.prototype（称Object.prototype），没找到往上第三个_proto_，Object的_proto_，不存在此特殊属性（没有该示例对象），因此查找的属性不存在显示值undefined。

再次重点，_proto_原型对象属性也就是上一个（构造函数）prototype
不是複制，以访问原型链的方式。

继承

需要继承的属性、方法都必须存储在原型属性中。
前任：
对象.原型.名称
对象名称
继承（改革差异）
doSome{proto{name...}}
doSome{proto{...}}

构造器(函式)constructor，JS的类

面向对象理论

基于类创建类 (底下的基于类创建类)
基于类创建对象
基于对像创建对象

var 对象 = new 构造函式(传入值)var 新对象 = Object.create(原型对象)var 对象 = new (原型对象).constructor(传入)　调用对象的构造器函数，创建新对象

对象.constructor.name　取得对象的构造器名字：值="Person"

修改原形
在构造器的原型加上属性、方法
前任： Person.protype.farewell = fn(){}
→整条继承方法会动态更新，每一件作品创建的实例都会自动获得（该属性或）

一般说在构造器上定义合适的
原型在定义非 常数属性 (constant property 不会改变的属性）时，会遇到一些问题。
前任： Person.prototype.fullName = this.name.first + this.name.last
→ 吃不到这个範围……等等问题

最常见的定义模式

//构造器只定义属性fn Test(a,b,c,d){//属性定义};//prototype定义不同方法，使代码分装且易读Test.prototype.xMethod = fn(){}//第二种方法Test.prototype.yMethod = fn(){}

基于类创建类

基于类创建类 call()函数式
fn 新类 (参数...){
原类.call(this,参数...)
this.(属性or方法) //增加属性、方法
}

添加方法也可以使用以下
新类.prototype.方法 = fn(){}

继承类语法

class 新类 extends 父类{
　constructor(所有参数) //包含新增参数
　super(父类参数) //注意在this.属性前使用，挪用父类的参数
　//简单理解成目前的this是父类，故会发生错误，需使用super

　this.属性 = 属性; //赋予this.属性(成员)值(传入的参数值，在所有参数中)
}

以类创建类补充

以类创建类 (构造器创建构造器)

最初定义新构造函数
fn 新构造(全部参数，包含原型对象构造器参数){
原型构造器.call(原型参数)
this.属性、方法...
}

第二步继承自构造器（才可以向上寻找
新构造器.prototype = Object.create(原型构造器)

第三部将构造器基准定位置新构造器（循环寻找自身新构造器，原先定位在原型）
新构造器.prototype.construstor = 新构造器

get、set

使用get set函式可以在调用及设置时运行代码
应该归 类、物件中（应也可以置于构造器中？）
get 虚拟属性(){
　//其他运行代码
　return this.属性
}
set 虚拟属性(新值){
　this.属性 = 新值
　//其他代码
}

继承用意

对象继承的使用
当开始创建相似的对象时，何不常用功能的通用
而在需要更特殊的对像类型时，在继承自能特性，即更方便使用。

继承的原理
功能的共享虽不继承，其适用为委託
因为该特殊对象并不会复制其通用功能。

对象的使用
创建相关变量、函数时，并希望可以打包、追踪，
分类使用对象。
对像在希望把数据集合起来给另一个端时，非常特殊。
（这些都可以在不使用构造器、继承下使用；简单的对象）。

其他

const 宣告的变数物件，可以直接改属性，不得"赋值
ex:

const obj={tag:"Hello"}obj.tag="goodbye"ex:

const obj={tag:"Hello"}obj={} //Uncaught TypeError //物件->"赋值"物件

let 的变数才可以改变型态，得赋予

let obj={tag:"Hello"}obj={} //物件->"赋值"物件

JSON

JSON 物件表示法
JavaScript 对象表示法
将结构化数据格式为JS物件的标準格式
常用于网站上的资料、传输
例如：将资料从服务器端传送到用户端，以显示网页

当你从JSON中读取资料时，JSON可作为物件。
当要跨网路发送JSON时，就是字串

JSON方法

接收到字串作为JSON数据，需转换(返回)成对象
ex: .responseType="text" 、 "{"tag"："Hello"}"
使用JSON.parse函式
ex: *
onload = fn(){
返回 = 请求对象.reponse //若返回的是上述字串型别，则使用下列函式式
返回 = JSON.parse(返回) //返回为字串的情况下，函式将字串转换(返回)为对象
其他...
}

把对象 转换(返回)为JSON字串
JSON.stringify(对象)
上段例子即是
返回 = 请求对象.reponse
返回 = JSON.stringify(返回)

未完待续

(2021/07/22以后物件、非同步，尚未整理)