JS2 概念（总）

# 对象和标签

1.关系

对象里的：键 key 属性 = 值 value 属性值

dom 对象只有：属性和属性值的概念

dom 标签上的 id，class，style，标签天生自有的属性，可以通过 dom 对象直接获取，对于自定义属性不可以直接获取

使用 get/setAttribute 来获取或设置。

----------- 总结：一切皆对象；

# 尺寸和设置

因为 dom 对象的 style 对象获取的是标签上的 style 属性，不能获取 css 里的样式值所以才有一下几个 api：

# offset 偏移量

1.offsetParent 获取带有定位的父元素，如果找不到则返回 body

2.offset 获取的值是来自所有的样式里的，包括样式表和自身的 style 行内样式.

3.offset 获取的值是纯数字不带单位

4.offset 只能获取值，不可以修改值。

5.offsetTop 距离带有定位父元素的顶部距离

6.offsetLeft 距离带有定位父元素的左部距离

7.offsetWidth 边框 + 内边距 + 内容的宽

8.offsetHeight 边框 + 内边距 + 内容的高

# client 可视区

1.clientTop 上边框大小

2.clientLeft 左边框大小

3.clientWidth 内容 + 内边距的尺寸

4.clientHeight 内容 + 内边距的尺寸

# scroll 滚动—滚动条

1.scrollTop 被卷上去的页面高度

2.scrollLeft 横向滚动的距离

3.scrollWidth 元素实际的宽，不含边框 ----如果子元素宽度超过自身，则使用的是子元素的宽，否则才是自己的宽

4.scrollHeight 元素实际的高。不含边框

# bom 浏览器对象模型，顶层对象是 window

# document 文档对象模型，属于浏览器的

# location 地址栏对象

-href 可以获取地址和设置地址跳转

-reload 刷新页面

# navigeter 浏览器信息对象

- userAgent 用户代理信息---浏览器的标识信息

# hrstory 历史记录

-back（）后退

-forward （） 向前

-go（） 传数字控制历史记录的跳转 1 向前跳一个历史记录，-1 向后一个跳转

# screen 屏幕信息

- availWidthheavailHeight 是获取的浏览器在屏幕上可以使用的区域尺寸

- width 和 Height 是电脑的真实尺寸

# 正则表达式

用于查找字符串，他更快，更方便，语法更抽象

# 正则语法的两种方式

1.字面量  /规则/

2.构造方式 new RegExp

3.修饰符

- i 不区分大小写匹配

- g 全局匹配

- m 换行匹配

  4.元字符串

- ^ 起始位置

- $ 结束位置

- \w 匹配字母 \W 非字母

- \d 匹配数字 \D 非数字

- \s 匹配空字符串

- \uDC00-\uDFFF 匹配中文

# ajax

-1.前端与后端进行数据交互的工具

-2.特点 -无刷新历史记录

--ajax 是异步执行的 可以改成同步执行 open（‘请求方式’，’接口地址‘ ，true）默认三个参数 true 表示异步，设置 false

-3.常用的请求方式

--get 默认的请求方式，表示获取

--post 用于上传,添加，修改等

--get 和 post 的区别

--1.参数不同：get 方式参数拼接在 url 后面，post 使用 send 函数发送

--2.请求头不同：get 默认不需要设置请求头，post 一般西药设置请求头

--3.安全性不同：get 参数暴露在 url 地址栏里，容易被泄露，post 参数在请求 tinei 相对安全

--4.参数的大小不同：get 参数使用 url 传输，受浏览器器地址栏长度长度限制，post 没有大小限制

--5.参数类型不同：get 地址栏里传输数据只能是字符串，post 可以传输二进制数据流。比如上传文件

--6.历史记录：get 方式会产生历史记录 post 不会

--7.速度不同：get 参数简单所以比 post 快，post 相对于 get 慢

-4.ajax 的步骤

--先创建一个请求对象

--建立链接 或响应

--发送请求

--监听响应

--获取数据

# 同步和异步

--同步是排队执行，一次只能执行一个，比如说 js 代码从上向下执行，按顺序执行；

--异步是同时执行多个，比如定时器

# 面向对象不是一个特殊的固定的语法,它是一种设计模式，一种开发思路，简称 oop

-三大特征:封装，继承，多态

2,特点:所有的属性和方法都是用来描述一个具体的事物或对象的

# 面向过程:只专注于实现某个功能，而不是针对某 1 个事物，简称 opp 基础面向对象

# 基于面向对象思路的两种写法:

-1，面向对象最初是用来复用开发功能插件的

-2,由面向对象引出的工厂函数模式[js 里所有的数据都是通过 new 一个构造函数得到的]

-3.构造函数被 new 了以后,得到的返回值是对象,又叫实例化对象,简称实例对象

-4，自定义自己的构造函数，用来使用 new 调用，生成自己的实例对象

# new 关键字使构造函数发生了什么事情?

-1，会在函数内部创建一个空对象

-2，把函数内的 this 指向这个对象

-3，把函数的原型对象执行这个对象的原型对象[继承]

-4，执行函数

-5，return 返回这个对象

# 多态，传入不同的参数，改变不同的内容

基于原型对象实现继承，扩展 

对象找属性，先从自身找，找不到沿着自己的原型对象找

在自己的构造函数上的原型对象来扩展方法:函数的显示原型对象；

# 基于原型对象实现继承,扩展

对象找属性.先从自身找.找不到沿着自己的原型对象找

对象的隐式原型对象

总结: 对象的隐式原型对象就是构造函数的显示对象

对象查找属性的时候，先从自身找，找不到就沿着原型对象继续-->原型链

# jquery

-1，jquerv 是基于原生 js 操作 dom 封装的类库

-2.特点: 语法简单，对浏览器兼容做了处理

-3，jq 对象转成原生对象: $('#btn')[0]、$('#btn').get(0)

-4，原生对象转成 jg 对象: $(obj)

-5,jg对象是什么类型: 数组

-6,jg常用api: 选择器$('xx')、样式 css()、ajax $ ajax()、页面完成加载$(function(){})===window.onload 事件 show()控制元素显示基于 dispLay 实现、hide()隐藏元素、fandeIn 淡入、fandeUp 淡出、animate()动画

# 模块化

优点: 独立作用域，不会污染全局

高内聚低耦合，复用

-1.避免全局命名空间污染

-2.提高代码的可重用性

-3.支持代码拆分和并行加载

-4.易于维护和测试

# 面向对象的产检问题

1，什么是面向对象；2，new 对函数做了什么； 3.原型和原型链的关系；