javasciprt基本语法

一javasciprt入门
内部标签 alert 弹窗

外部引入

二js语法
1定义变量 变量类型 变量名=变量值
2.只有var js的变量类型 不能以数字开头 _$ 可以中文命名
3.条件 if( 满足条件 ){ }else{}可以 嵌套
4.多行注释/* */
5 javaScript 严格区分大小写
6 网页 F12 控制台console// console.log()打印变量
相当于打印system.out.println
NetWork 网络 Application外部数据
ekenebts 元素 console 调试js source 源码

7.数据类型js不区分小数和整数
数值,文本，图形，音频，视频
Number
123//整数
123.1//浮点数
1.234e3科学技术
-99负数
NAN not a number 不是数字
Infinity 无限大

字符串
‘abc’ "abc’字符串

布尔值
true false

逻辑运算
&& 真 || !

比较运算符
= 赋予值
==（类型不一样，值一样也会判断为true）
===绝对等于 （类型一样，值一样才判断为true）

须知NaN==NaN 与所有数值都不相等包括自己
isNAN才可以判断

（1/3）===(1-2/3)不相等
尽量避免使用浮点数进行运算，存在精度问题
console.log(Math.abs(1/3-(1-2/3))<0.0000001)

null和nudefined
null 空
undefined 未定义

数组
不需要这样
//
var arr=[12,3,6,true,null]0,1,2,3,4
数组的每个元素
没有异常 超过数组下标就会undefined

对象
数组是中括号 ，对象大括号
var person={ name:“请将”,age:3,tags:[“32”,23,32] }
每个属性逗号隔开 最后的不用加
person.name 取对象的值

三 严格检查模式
E6 严格检查模式 ‘use strict’;
javascript随意型 产生的问题
必须写在 js 的第一行
局部变量 let用let声明

3数据类型

3.1字符串
1.正常字符串我们使用单引号，或者双引号包裹
2注意转义字符’ \n \t \u4e2d \u#### Unicode
aScill字符\x41
3 多行字符串编写 Tab下面 ·
var msg= ` hello
你好

4模板字符串 let name="qinjiang" let mig=你好呀，$(name)`

5.字符串长度
console.log(str.length) length长度

6.字符串可变性，不可变

7.大小写转换
1 //注意，这里是方法，不是属性
toUpperCase() tolowerCase() ;
index 获得下标 subString 第几个到几个

3.2 数组
Array 可以包含任意的数据类型
长度 是可变加入arr.length（） 数组大小就会变化
如果赋值过小就会丢失元素
2indexOf（） 下标索引
字符串的“1”和数字1是不同
3.slice() 截取slice的数组的一部分,类似与String 中的subString
4push 向尾部加值,pop（）弹出值
5.unshift() 向头部 加入元素 shift 去掉头部的元素
6.排序 sort（） 反转 reverse（）
8拼接concat（）返回新的数组
9.连接符 打印拼接数组’
10多维数组arr=[[1],[3]]

对象
javaScipt 中的所有建都是字符串，只是任意对象
若干 var 对象名 ={
属性名：属性值，属性名：属性值
}

js中对象,键值对描述属性xxxx:xxxx

2对象赋值

3使用一个不存在的对象属性，不会报错！undefined

3.动态的删减属性 通过delete删除对象的属性

4.动态的添加，直接给新的属性添加值即可
perso.“haha”=haha

5判断属性值是否在这个对象中~！in 可以找父类的方法
‘’ in 对象

6.判断一个属性是否是这个对象自身的hasOwnProperty()

3.4 流程
1 if() else（）
2 while (){} do{}while();
3 for(){ console.log(10)}

数组循环
age.forEach(function value)
console.log(value)

for(let i=0;i<100;i++)
{console.log(i)
}

num 索引for in
for(var num in age)遍历索引
{
cnsole.log(age[num])
}

3.5 Map 和 Set
var map=new Map[[‘tom’,100]]
map.get() 通过key获得 value
map.set(‘admin’,123456); 加了一个值或改
map.delete(‘tom’)删除
new Map();
new Set();

Set 无序不重
var set=new Set([3,1,1,1])可以去重复代码
set.add(2)
set.delete(1)
set.hash()是否有

4.函数
4.1.定义函数
public 返回值类型 方法名(){}
绝对值方法
function abs(x){ if(x>=0) return x; else return -x; }
一旦执行return代表函数结束，返回结果!
如果没有执行return, 函数执行也会返还结果,结果就是undefined

方法二等效
var abs=function(){ if(x>=0)return x; else return -x;}
function（x）{}这是一个匿名函数,但是可以把结果赋值个abs
通过abs 就可以调用函数

abs(10) abs()
参数多了 只一个参数

参数是否存在的问题?
if(typeof x!==‘number’)throw ‘not a number’
//手动抛出异常
参数有多个

arguments
arguments这是js 免费赠送的关键词
代表，转递进来的参数，是个

argument包含所有参数,我们有时候使用多余的参数进行附加操作

rest
Es6引入的新特性，获取以经定义的参数以外的所有参数
function aa(a,b…rest){ 代码块}
rest参数只能卸载最后面，必须用…标识

4.2 变量的作用域
javascirpt中，var定义变量实际是有作用域
闭包
function qj()
{
var x=1;
x=x+1;
}
x=x+2;//报错
如果两个函数使用另外相同的变量名
，只要在函数内就不冲突
函数内类可以访问外部函数

假设，内部函数变量和外部函数的变量同名，遍历
由内向外查找，双亲尾排机制，

提升变量的作用域,但是不会赋值
说明：js 执行引擎会把所有写在前面
这个实在javaScript建立之初就存在的特性，
把代码写在头部

全局函数
定义外部变量

全局对象window
绑定所有全局变量
alert这个函数本身也是一个windows变量

//var old_alert=window.alert

javascript 实际只有一个全局作用域,任何变量（函数也可以视为变量），假设没有在
函数作用范围找到，就会向外查找，如果全局作用域都没有找到就会报错

规范
由于我们所有的全局变量都会绑定到我们的window上,如果不同的js
文件,使用在
var kuangshen={};

把自己的代码全部放入自己的唯一的空间空间

局部作用域
let

function add()
{for(var i=0;i<100;i++)
{console.log(i+1)}

}

let关键字，解决局部作用域冲突问题
建议大家都用let去定义局部作用域的变量

常量const
ES6之间 ,只要用全部大字命令就是常量

在E6引入常量关键字 const

4.3 方法
var huangshen={name:‘秦疆’,age:function(){
new Date（）.getFullyear()
}}
定义方法就是放在对象的里面，对象只有两个东西：
属性和方法
调用方法必须有有括号
this.代表什么？
this是无法指向

getAge.apply(huangshen,[]);

5.内部对象
标准类型
typeof 123 typeof true typeof number typeof [] typeof function
5.1 Date
now.getDate() //星期几
now.getMonth //月
now.getHours()//小时
now.getFullYear() //年
now.getMinutes(); //分
now.getSeconds() 秒
now.getTime() //时间搓

now=new Date(15781061755991);
now.tolocaleString
toGMTstring()

5.2json
数据传送
对象都用{}
数组都用[]
所有的键值对 都用keyValue
JSON.stringfy(对象)
(’{“a”:“b”,“c”:“c”,“da”:“dv”}’);

字符串传换成JSON

5.4Ajax
原生的js 写法,xhr异步请求
jQuey 封装好的方法￥（“#name”.a）
axlos请求

6、面向对象
javascrip,java,C#…面对对象:javascript也有些去吧
类：模板
对象：具体的实列
在javaScipt这个需要大家换一个思想

xiangming.proto=user

class继承
funciton Student(name)
{this.name=name;
}
Student.prototype.hello=funtion()
{
alert(“hello”)
};

class关键字，是在Es6引入
定义一个类,属性,方法
class Student
{
constructor(name){
this.name=name;
}
hello()
{alert(‘hello’)}
}

class xiaoStudent extends Student{}

原型链
会指定object object->objectpro

7.操作BoM对象(重点)
BoM:浏览器对象基础
javaScript诞生就是为了能够在浏览器中运行

Bom:浏览器
内核的浏览器
IE 9-11
fireFox
chrome
safari
opera

window 代表浏览器窗口

window.alert
window.height

Naigator
Navigator,代表封装浏览器的信息
navaigator.appVersion

大多数时候，我们使用navigator对象,用为会被认为修改

screen
屏幕

location
location代表页面的URL信息
host
href
protocol
reload :f reload()
location.assign()

document
document 代表当前的页面,HTML Dom文档树

cookie 个人信息

history历史记录

8、操作DOM对象
DOM :文档对象模型
整个浏览器网页就是一个DOM 树型节点
更新：更新Dom节点：
遍历dom节点:得到DOm节点
删除 删除一个节点
添加： 添加一个节点

document.getElementsByTagName(‘h1’)
document.geElementById(‘p1’);
var h1=document.getElementsByClassName(‘h1’)
var childrens= h1.children；获取父节点下的所有节点
fathre.firstChild
p1.next()

更新节点
idl.innerText=‘456’
ill.innerHTML=’’

操作文本
var idl=document
ldi.style.color=‘red’
ldi.style.fontside

删除节点的步骤：先获取父节点
father.remobeChild(p1)
通过父节点,通过父节点
var self=document.getElementById(‘p1’)
self.remove()
删除是个动态过程
father.removechild(father.children[0])
father.removechild(father.children[1])
father.removechild(father.children[2])
说明：删除多个节点的时候，children是在时隔节点

获得某个Dom节点,结束这个dom节点是空的，我们通
过innerHtml。就可以增加一个元素

追加
var js=document.getElemrntById(‘js’)
var list=document.getElementById(‘list’)
//创建一个节点
var newp=document.createElement(‘p’)
newP.id=‘newp’
new.innerText=‘Hello.kuangshen’
list.appendchi
创建一个标签,实现插入
//创建一个标签节点
document.createElement(‘script’);
myScript.setAttribute(‘type’,‘text/javascript’)创建一个
//通个这个属性添加任意的值
var body=documengetElementByTagName=(‘body’)
var style=document.createElement
mystyle.inndfHTML=‘body{background-color:green}’
document.getElementByTagName(‘head’)[0].appendChild(mystyle)

ee.insertbefore(js,ee) list被包含的节点
father.children[3]

9.操作表单
表单是什么
文本框 text
下拉框
单选框 radio
多选框 checkbox
隐藏框 hiden
密码框

script
input.text.value
script

boy.checked true

girl_radio.checked

提交表单
高级
提交

function aaa()
{
var uname=document.getElementById(‘username’)
console.log()
}
MD5算法
pwd.value=md5(pwd.value)

md3pwd.value=md5(pwd.value)

onsubmit 绑定提交的函数 ,true,false

表单优化
pwd.valueb

10 、jQuery
javaScrip 和jQuery:
工具类
jQuery 库
里面存在大量的javaScirpt
获取jQuery

jQuery

$(selector).action()
//选择器

$(’#test-jquery’).click(function(){alert(‘hello,jqu’) }
)
)

选择器
//标签
document.getElementsByTagName()
//类
document.getElementById()
//id
document.getElementClassName()

$(‘p’).click()标签
$(’#id’).click()//id
$(’.class’.click()//class

http://jquery.cuishifeng.cn

事件
鼠标事件,mousedown 按下
mouseenter mouseleave离开 mousemove鼠标移动￥
mouseover 点击结束
键盘事件
$(function()
{
KaTeX parse error: Expected 'EOF', got '#' at position 3: ('#̲divMove').mouse…(’#mouseMove’).text(‘x:’+e.pageX+‘y’+e.pagY)
}

jQuery操作Dom元素

}
)