首页 > 编程语言 >JavaScript基础回顾

JavaScript基础回顾

时间:2022-08-19 11:59:39浏览次数:76  
标签:key 回顾 JavaScript 基础 获取 数组 字符串 节点 属性

变量声明

var 伪全局变量 const常量(块级作用域) let 块级作用域变量

运算符及表达式

算术运算  + - * / % ++ --

逻辑运算 &&(同true取最后一个 false取第一个)  ||(有true取第一个true  false取最后一个)  !(取反)

比较运算  >  <   <=   >=  !=  ==    ===

赋值运算  =  +=  /=%=  *=   -=

三目运算 表达式?true的结果:false的结果

位运算 >>  <<(执行最快)

基础数据类型

字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol,大数值类型(BigInt)

强制转换的方法

String()

Boolean()

Number()不会忽略后面的不是数值的内容 parseInt()忽略后面的不是数值的内容 parseFloat()

条件控制语句

if  else  else if

Switch  case  break  (采用===)

循环结构

for  根据对应的判断条件 迭代条件 和对应的初始值进行判断

for in  遍历对象 用于遍历key

for of 遍历数组 用于遍历value(必须实现迭代器  size  length 属性)

while  根据对应的判断条件 和迭代条件(循环体中) 进行判断(初始值在外面)

do while  (先做一次后判断)

函数(Funciton 为构造)

使用function 声明 分为匿名函数(只调用一次)和具名函数(重复调用)

调用函数  函数名() 自执行函数(函数)()

arguments 伪数组 参数数组(获取所有传递的参数)

字符串

字符串不可变

字符串的相关方法

indexOf  根据字符串找下标(找第一次出现)

lastIndexOf (从后往前找 找第一次出现的下标)

search  (支持正则)

charAt 根据字符串找下标的ASCII码

charCodeAt toUpperCase  转大写

  toLowerCase  转小写

slice 截取

substring 截取

substr 截取

concat 连接

split  分割(支持正则)

replace  替换(支持正则)

match  匹配(返回一个匹配的数组  支持正则)

字符串属性

length 返回对应的字符个数(通过下标来访问对应的字符)

 

数组

数组是可变的

数组的相关方法

pop 删除最后一个

push 添加到最后

shift 删除第一个

unshift 添加第一个

concat 连接  

join 转为字符串

sort 排序

reverse 反转

 splice 删除

slice 截取

indexOf 根据对应的元素找下标

高阶函数

forEach  遍历

map   遍历

reduce   计算

reduceRight  计算

filter  过滤

some  判断有符合条件的

every  判断每一个是否都符合条件

find

findIndex

data

日期对象(获取的是本地时间)

日期对线的方法

get(获取)

getFullYear 年  getMonth 月(1月为0) getDay 星期几(星期天为0) getDate(月中的第几天)getHours(时 24小时制 24为0 )getMinutes(分 60为0) getSeconds(秒 60为0)...

set(设置 设置超出自动向上递增)

setFullYear 年 setMonth 月(1月为0)setDay 星期几(星期天为0) setDate(月中的第几天)setHours(时 24小时制 24为0 )setMinutes(分 60为0) setSeconds(秒 60为0)...

时间戳的获取

getTime获取

Date.now()获取

Object

对象里面的存储以key:value存储 通过key可以访问value

obj.key 及 obj[key]

BOM

顶层对象 window

reload 刷新 open打开 close关闭 print打印 弹窗的方法(alert confirm prompt)控制台打印(console.(log,debug,info,error,warn))resizeTo窗口大小改变 moveTo改位置  scrollTo滚动条位置

location 地址栏对象

属性:href (地址) pathname(路径) host(主机) hostname(主机名)  hash(#后面的内容) search(?后面的) 协议(protocol)origin(跨域)

方法:location.replace替换地址(不会加入历史) location.assign(会加入历史)  location.reload 刷新

history 历史对象

属性:length 获取个数  state 状态

方法:forward 前进 back 后退 go 任意的历史页面 pushState(更改当前的地址 加入历史页面)replaceState(更改当前的地址 加入历史页面)

history路由: 通过onpopstate监听

screen 屏幕对象

属性 availWidth availHeight (获取屏幕的宽高 可用于js做适配)

frames 框架对象(它是一个独立的window)

navigator 导航对象

属性:userAgent(浏览器系统)

DOM

顶层对象 document 

节点类型 

元素节点element 属性节点 attribute 文本节点 text

节点属性

nodeValue节点值  nodeName节点名 nodeType节点类型

节点操作相关属性 

parentNode 父节点 parentElement 父元素节点 childNodes子节点 children子元素节点 firstChild第一个子节点 lastChild最后一个子节点 previousSibling 前一个兄弟节点 nextSibling后一个兄弟节点 previousElementSibling前一个兄弟元素节点 nextElementSibling后一个兄弟元素节点

节点创建

document.createElement 创建元素节点

document.createAttribute 创建属性节点  

document.createTextNode 创建文本节点

节点的插入

append  追加多个子节点

appendChild 追加一个子节点

insertBefore 插入某个节点到子节点前面

节点的替换

replaceChild 讲一个节点替换某个节点 remove 删除 cloneNode 节点克隆

元素节点的获取

getElementById  

getElementByClassName

getElementByName

getElementByTagName

querySelector(根据选择器获取第一个)

querySelectorAll(根据选择器获取所有的)

元素节点的属性

innerHTML  innerText className id title style 

atributes 获取所有的属性节点 (nameNodeMap 伪数组)

对于默认的属性直接. a标签的href input 标签的value等

属性的操作

getAttribute setAttribute removeArrtibute

事件

事件流  冒泡(从里到外)捕获(从外到里)

常用的事件分类

鼠标事件mouse开头的 (mouseenter和mouserover(会冒泡))

键盘事件 key开头(keypress和keydown)

html事件(change,input,focus,blur ,submit,reset,select...)

event对象

属性:target offsetX offsetY pageX pageY clientX  clientY screenX screenY button (ctrlKey shiftKey altKey) type  keyCode  charCode 

this

this指向当前事件触发的元素  谁调用this this就指向谁

正则(Regexp 构造)

声明形式://     new Regexp()

修饰符

g 全局 i 忽略大小写 m 分组

元字符

[] {} ()^ $ 

+一个到多个   * 零个到多个 ?零个到一个 

\d数字  \D  \s空白   \S  \w数字字母下划线   \W

. 表示所有 

方法

test  测试(返回true 和false) exec 执行(返回数组)

cookie

cookie存在于浏览器端的一个存储容器,它是为了解决http的无状态问题

cookie的获取

document.cookie

cookie的结构

key=value;expires=过期时间;path=路径;domain=跨域地址;secure安全

cookie的特性

 随请求分发

大小4kb

存储的数据为字符串

存储在浏览器上

localstorage 本地存储 sessionstorage 本地存储(浏览器关闭直接删除)

大小5MB

存储的数据类型较多

不会随请求分发

不能自动删除

json格式

json是一种数据交互格式。一种是对象{} 一种是数组[],key一般是字符串(""),值可以是任意

序列化方法

JSON.stringify

反序列化

JSON.parse

window.eval (不安全的)

es5 es6

es5新增

严格模式  新增数组的高阶函数 (存在函数的this)this执行更改的方法(bind apply call)

es6新增

字符串新增的方法 includes endsWith starsWith repeat

数组新增方法 Array.from() Array.of find findIndex

函数新增 箭头函数 默认参数 

新增值以及修饰符  symbol BigInt  const  let

新增对象  set  map 

解构 {} 扩展运算符...

新增for in  for of

新增模块化  import  export 

 

标签:key,回顾,JavaScript,基础,获取,数组,字符串,节点,属性
From: https://www.cnblogs.com/banxi/p/16601229.html

相关文章

  • linux零基础预科自己的记录
     1.脚本:一系列的shell命令组成的程序叫做脚本。2.linux文件的类型 文件夹:  d普通文件:-r连接文件:l 3.在linux的控制台上如何使用后man命令如何退出 进入后......
  • 【java基础】分支结构if-else、switch-case
    1.if-elseinta=10;if(a==0){ System.out.println("a等于0");}elseif(a<0){ System.out.println("a小于0");}else{ System.out.println("a大于0");}(1)条件表达式......
  • Postgresql之基础
      在默认配置下,之允许本机访问Postgresql#切换到postgres用户su-postgresLastlogin:WedMar113:16:48CST2017onpts/1-bash-4.2$psqlpsql(9.2.1......
  • 【Java基础】三元运算符 a>b ? 1 : 2 ;
    1.三元运算符a>b?true:false;可以简化为if-else语句if(a>b){ System.out.println("true");}else{ System.out.println("false");}2.运算符的优先级只有单目运......
  • 【Java基础】位运算<<,>>,>>>,&,|,^,~
    1.位运算符位运算符是对整数的二进制进行的运算。2.位运算符细节<<:在一定范围内,每向左移1位,相当于*2>>:在一定范围内,每向右移1位,相当于/2>>>表示无符号右移运......
  • 【Java基础】逻辑运算符&,&&,|,||,!,^
    1.逻辑运算符用于连接布尔型表达式,例如:x>3&&x<62.&和&&的区别表示and(1)&,左边无论真假,右边都进行运算。(2)&&,如果左边为真,右边参与运算;如果左边为假,那么右边不参与......
  • [一、基础语法]19流程控制:breake,continue,return循环控制语句的使用
    热烈欢迎,请直接点击!!!进入博主AppStore主页,下载使用各个作品!!!注:博主将坚持每月上线一个新app!!!......
  • Vue基础——将原生事件绑定到组件
    Vue基础——将原生事件绑定到组件1、首先看一个小例子父组件:<template><divid="app"><my-button@click="handleClick"></my-button></div></template><......
  • 8/18 python基础学习
    第四章操作列表函数range(m,n)包含m-n的数,包括m,不包括n,左闭右开。range(m,n,d)d为步长。value**2其中**表示乘方。列表解析:[expressionforiter_valiniterab......
  • Java基础知识整理(部分)
    继承的本质是对某一类的抽象,从而实现对现实世界更好的建模1.extends的意思是扩展,子类是父类的扩展2.Java中类只有单继承,没有多继承在Java中,所有类都默认直接或间接继承Obje......