函数
//函数必须进行调用才会执行
function sayHi(){
consloe.log('hello')
}
sayHi()
//函数要有返回值,一定要添加return关键字,否则返回值为undefined
function getSum(a,b){
//consloe.log(a+b)
//return a+b
console.log(arguments)
//argument 接收所有实参,并保存到argument数组
let sum = 0
for(let i in argument){
sum + =arguments[i]
}
return sum
}
let e = getSum(a=2,b=3)
getSum(3,4)
console.log(e)
调用:
1,声明函数时的形参没有数量限制,当有多个形参时使用“,”分隔
2,调用函数传递的实参与形参的顺序一致
匿名函数——没有名字的函数
//function sayHi(fn{
// fu()
// console .log('nihao')
//}
//function (){
// console.log('jiangjia')
//}
//sayHi(sayhello)
setInterval(function(){
console.log('')
}
伪数组:实参数不确定,用arguements接收,如果参数固定写形参,不固定用arguments
有些地方不能用arguments
函数表达式
//let a = function getSum(){
// console.log('')
//}
//a()
//立即执行函数
(function(){console.log('123')})
值传递,引用传递
//值传递
let a = 10
let b = 20
function change(x,y){
x=30;
y=50;
}
change(a,b);
alert(a + "--" + b)
//引用传递 传地址,发生改变
let arr = [1,3,4,5]
function change2(a){
a.push(1000)
}
change2(arr)
alert(arr)
默认值参数
function getCir(r,PI = 3.14){
return PI * r * r
}
let a = getCir(3)
console.log(a)
箭头函数
setInterval(()=> console.log('111'),1000)
**递归
递归式函数的条件:
1,基线条件
问题分解为最小问题时
2,递归条件
将问题继续分解**
//求9!
//9*8!
function jiecheng(n){
if(n === 1){
return 1
}else{
return n* jiecheng(n-1)
}
}
let a = jiecheng(2)
alert(9)
闭包函数
·可以在函数的外部访问到函数内部的局部变量
·让这些变量始终保存在内存中,不会随着函数的结束而自动销毁
数组遍历
let arr = [a,2,3,4,5,6]
for (let i= 0;i < arr,length;i++ ){
console.log(arr[i])
}
字符串的常见方法
let str = new String()
// let str = '你是who'
console.log(str.split('w'))
console.log(str.substring(2, 4))
console.log(str.startsWith('你'))
console.log(str.endsWith('你'))
console.log(str.includes('w'))
对象——保存用户信息,无序的数据集合,数组是有序的数据集合——描述某个事物
// let arr = [160, 160]
// 对象:无序的数据集合
let obj = {
uname: 'zhangfei',
age: 21,
gender: 'nan'
}
// console.log(obj)
// 查找对象元素
console.log(obj.uname)
console.log(obj['age'])
// let obj2 = new Object()
let obj2 = {
uname: '刘德华',
age: 60,
sing: function () {
console.log('我要唱歌了')
}
}
obj2.sing()
对象的增删查改
let obj = {
uname: 'zhangfei',
age: 21,
gender: 'nan'
}
// obj.uname
// obj['age']
// 改:对象.属性名
obj.uname = 'GGBond'
// 增加 对象.新属性名
obj.sing = function () {
console.log('sing~')
}
// delete 对象.属性名
delete obj.gender
console.log(obj)
对象的遍历
let obj = {
uname: 'zhangfei',
age: 21,
gender: 'nan'
}
for (let k in obj) {
console.log(k)
console.log(obj[k])
}
数组对象
let arrObj =
[
{
uname: 'zs',
age: 21
},
{
uname: 'jiangjia',
age: 33
},
{
uname: 'lisi',
age: 12
}
]
console.log(arrObj)
// arrObj[1]['uname']
for (let i = 0; i < arrObj.length; i++) {
for (let k in arrObj[i]) {
console.log(arrObj[i][k])
}
}
Math内置对象
console.log(Math.E)
console.log(Math.PI)
// Math.ceil向上取整
console.log(Math.ceil(3.1415))
// Math.floor向下取整
console.log(Math.floor(3.1415))
// Math.abs 绝对值
console.log(Math.abs(-3.12))
// pow
console.log(Math.pow(3.12, 10))
// 开平方根
console.log(Math.sqrt(9))
// 随机数
// console.log(Math.floor(Math.random() * 11) + 2)
let random = Math.floor(Math.random() * (10 - 2 + 1)) + 2
console.log(random)
日期内置对象
//let date = new Date()
//alert(date)
let year = date.getFullyear()
//alert(year)
let month = date.getMonth() + 1
//alert(month)
let day = date.getDate()
//alert(day)
let hh = date.getHours()
let mm = date.getMinutes()
let ss = date.getSeconds()
let gg= date.getDay()
alert(gg)
let a = 3.323245
laert(a.toFixed(4))//保留小数位
ducument.write(`${year}年-${month}月-${day}日-${hh}时-${mm}分-${ss}秒`)
dom
<button>提交</button>
<script>
const btn = document.querySelector('button')
// console.dir(btn)
console.log(typeof (btn))
获取元素的方法
// 1、通过css选择器获取 ('字符串') :狂(嘎嘎)推荐
const li2 = document.querySelector('.two')
console.log(li2)
const li = document.querySelector('li')
console.log(li)
// document.querySelectorAll将所有匹配的元素全部获取到,并存放到伪数组
const lis = document.querySelectorAll('li')
console.log(lis)
for (let i = 0; i < lis.length; i++) {
console.log(lis[i])
}
const li3 = document.querySelector('ul li:nth-child(3)')
console.log(li3)
// 其他
console.log(document.getElementsByTagName('div'))
console.log(document.getElementById('four'))
console.log(document.getElementsByClassName('two'))
修改元素内容
<div class="one">我是一个即将被更改的盒子</div>
<div class="two">我是一个即将被更改的盒子</div>
<script>
// 1、获取元素
const box1 = document.querySelector('.one')
const box2 = document.querySelector('.two')
console.log(box1)
console.log(box2)
// 2、操作
box1.innerText = `<h1>jiangjia</h1>`
box2.innerHTML = `<h1>chensongjie</h1>`
修改元素属性
<img src="../images/1.webp" alt="刘德华" title="刘德华">
<input type="text" placeholder="wedjed" readonly>
<button disabled>同意该协议</button>
<script>
// 1、获取元素
const img = document.querySelector('img')
const ipt = document.querySelector('input')
const btn = document.querySelector('button')
// 改元素属性 对象.属性=值
img.src = "../images/2.webp"
img.title = "我是个大帅哥"
ipt.type = "password"
ipt.placeholder = "请输入用户名"
ipt.readOnly = false
btn.disabled = false
修改元素样式
<img src="../images/1.webp" alt="刘德华" title="刘德华">
<input type="text" placeholder="wedjed" readonly>
<button disabled>同意该协议</button>
<script>
// 1、获取元素
const img = document.querySelector('img')
const ipt = document.querySelector('input')
const btn = document.querySelector('button')
// 改元素属性 对象.属性=值
img.src = "../images/2.webp"
img.title = "我是个大帅哥"
ipt.type = "password"
ipt.placeholder = "请输入用户名"
ipt.readOnly = false
btn.disabled = false
修改元素样式属性
<div class="box1">1111</div>
<div class="box2 box1"></div>
<script>
// 1、获取元素
const box2 = document.querySelector('.box2')
const div = document.querySelector('.box1')
// 2、通过style修改样式
div.style.width = '500px'
div.style.fontSize = '16px'
div.style.backgroundColor = 'pink'
// 3、通过添加类名 calssName会将原来的类名删除掉,不建议使用
// box2.className = 'box1'
// classlist.add('类名')追加
box2.classList.add('box1')
// box2.classList.remove('box1') 移除
box2.classList.toggle('box1') //切换:有则删除,没有则添加
定时器
//setTime\setInterval 定时器
//setTimeout:某段代码或函数在多久后执行
//setTimeout(code|function,time(单位是毫秒))
//返回值是一个整数,代表定时器编码
let timer = setTimeout('console.log("我是一秒之后执行的代码")',2000)
// console.log(timer)
//传的是参数
let timer3= setTimeout(
fn,3000)
function fn(){
console.log('66666')
}
//setTimeout(函数或一段代码,延迟时间,实参....)
let timer4 = setTimeout(function(a,b){
console.log(a+b)
},2000,1,4)
let obj = {
uname:'gouxin',
a:3,
b:4,
sum:function(){
console.log(this.a)
}
}
obj.sum()
setTimeout(obj,sum,1000)
//定时器的第一个参数如果是对象方法,this不再指向对象,指向全局环境