22 12.22-12-24练习

85 阅读6分钟

for循环语句

for(变量;约束条件;变量变动){} 可用于遍历

cobntinue 结束当前循环

函数

定义函数

  • 声明式
    function test1() {console.log('111)} test1()
  • 赋值式
    var test3=function() {console.log("222")} text2()

函数预解析

 // 预解析 其实就是聊聊js代码的编译和执行
 // js是一个解释型语言,就是代码执行之前,先对代码进行通读和解释,然后再执行代码
 // 预解析需要两个步骤,会经历两个环节解释代码和执行代码
// 解释:有var情况下进行变量提升到最顶端,以及调用函数 再进行执行

函数返回值

函数默认没有返回值,加return 会返回一个结果

函数参数

function  fn(形参){}
fn(实参)

作用域

//什么是作用域,就是一个变量可以生效的范围
//变量 不是在所有地方都可以使用的这个变量的使用范围就是作用域

// 全局作用域
// 全局作用域是最大的作用域
// 在全局作用域于中定义的变量可以在任何地方使用
// 页面打开的时候,浏览器会自动给我们生成一个全局作用域window
// 


// 局部作用域
// 就是在全局作用域下面有开辟出来的一个相对小一些的作用域
// 在局部作用域中定义的变量只能在这个局部作用域内部使用
// 在JS中只用函数能生产一个局部作用域,别的都不行
// 每一个函数,都是一个局部作用域

对象

对象是一个复杂的数据类型,其实说是很复杂,但是没有很复杂,只不过是存储了一些基本数据的一个集合

// 1.字面量方式
// var obj = {
//   name: "kerwin",
//   age: 18,
//   location: "济宁"
// }
// console.log(obj);
// 2.内置构造函数的方式

var obj2 = new Object()
console.log(obj2);
obj2.name = "xiaohong"
obj2.age = 15
console.log(obj2);

对象可以进行增删改查

// 增
var obj = {}
console.log(obj);
document.write("姓名是" + obj.name)
obj.name = "kerwin"
obj.age = 100
obj.location = "dalian"
console.log(obj);
// 查
document.write("姓名是" + obj.name)
// 改
obj.age = 200
console.log(obj);
// 删
// delete obj.name
// console.log(obj);

对象的遍历

 for (var i in obj) {
  // console.log(i);
  console.log(obj[i]);
  document.write(i + ":" + obj[i])
  document.write("<br>")
}

数组

// 字面理解意思就是数字的组合
// 其实不太准确,准确的说数组是一个数据的集合
// 也就是我们把一些数据放在一个盒子里面,按照顺序排好
//字面量:
var ageArr = [12, 14, 15, 16]
var nameArr = ["a", "b", "c"]
var studentArr = [
  {
    name: "a",
    age: 101

  },
  {
    name: "b",
    age: 102

  }
]
console.log(studentArr);
//Array
var arr1 = new Array(12, 14, 15, 16)
var arr2 = new Array(10)
console.log(arr1, arr2);

数组有属性length 数组长度 索引直接for常规遍历

冒泡排序

实现原理: i个数进行排序
第一轮 i-1对比较
第二轮 i-1-1对比较(第一轮完有一个数沉底)
第j轮 i-j对比较
最后一轮 1比较

选择排序

实现原理:利用索引进行排序
一般是假设索引0处数字最小,让索引0处数字与后续数字进行比较,后续数字如果小于索引0处数字则交换,第一轮沉底第一个,以此类推

数字常用方法

影响原数组方法

// 数组常用方法
var arr = [1, 2, 3]
// push 往数组中追加元素  返回值
var res = arr.push(5)
console.log(arr);
console.log(res);
// pop 后面删除元素 返回值 呗删除数据
var respop = arr.pop()
console.log(arr);
console.log("返回值", respop);

// unshift 前面追加元素
// 返回值  长度

var resunshift = arr.unshift("tiechui")
console.log(arr);
console.log("返回值", resunshift);

// shift 前面删除删除元素
// 返回值 删除的这个元素
var resshift = arr.shift()
console.log(arr);
console.log("返回值", resshift);
// splice 删除
// var ressplice=arr.splice(1,1)
// console.log("返回值",ressplice);
// splice 增加
var arr2 = ["kerwin", "xiaoming", "tiechui"]
var ressplice = arr2.splice(1, 0, "gangdaner")
console.log(arr2);
console.log("返回值", ressplice);
// revere 倒序 返回值  反转的数组
var arr3 = [1, 2, 3, 4]
arr3.reverse()
console.log(arr3);

// sort 排序
// var arr4 = [11, 21, 3, 56, 7, 2]
// arr4.sort()
// console.log(arr4.sort(
//   function (a, b) {
//     return a - b
//   }    // ));
var arr4 = ['999', 10, 200, '123abc', 'que', 10001, 10]
var arr5 = arr4.sort(function (a, b) {
  return a - b
})
var arr6 = arr4.sort(function (a, b) {
  return b - a
})
console.log(arr5);
console.log(arr6);

不影响原数组方法

//concat 拼接
// var arr1 = [1, 2, 3]
// var arr2 = [4, 5, 6]
// var arr3 = arr1.concat(arr2, 7, [8, 9])
// console.log(arr1, arr2, arr3);
// var arr4 = arr1.concat()
// arr4.pop()
// console.log(arr1, arr4);

// // join 数组=>字符串
// var arr = [1, 2, 3, 4, 5]
// document.write(arr.join('-'))
// document.write(arr.join('|'))
// 365
// slice 截取(开始索引,结束索引)
// [前,后)

// var arr = ["aaa", "bbbb", "ccc", "ddd"]
// var arr2 = arr.slice(0, 2)
// console.log(arr, arr2);
// arr2.pop()
// console.log(arr, arr2);

// indexOf
var arr = ["aaa", "bbbb", "ccc", "ddd", "eee"]
// var res = arr.indexOf("aaa")
// var res2 = arr.indexOf("ccc")
// var res1 = arr.indexOf("ker")
// console.log(res);
// console.log(res1);
// console.log(res2);

// lastIndexOf -1找不到

var res = arr.lastIndexOf("aaa")
console.log(res);

// foreach遍历
//没有返回值
// var arr = ["aaa", "bbb", "ccc", "ddd"]
// arr.forEach(function (item, index, value) {
//   console.log(item, index, value);
// })

// map映射
// 返回的是一个原数组长度相同的数组但是内部数据可以经过我们的映射加工
// var arr = [1, 2, 3, 4, 5]
// 与foreach区别 1.foreach的作用是用来遍历数组,而map的作用是用来映射数组
// foreach没有返回值,而map是可以有返回值的
// for (var i = 0; i < arr.length; i++) {
//   arr[i] = arr[i] * arr[i]
// }
// console.log(arr);
// var arr2 = arr.map(function (item) {
//   return item * item
// })
// console.log(arr2);

// var arr = ["xaioming", "kerwin", "tiechui"]
// var arr2 = arr.map(
//   function () {
//     return "<li>" + 1111 + "</li>"
//   }
// )
// console.log(arr, arr2);
// console.log(arr.join("-"));

// filter 过滤
// 作用:过滤数组
// 返回值:返回一个新数组,内部村春的书院是数组过滤出来的部分内容
// 过滤条件:过滤条件以return的形式书写
// var arr = [
//   {
//     name: 'aaa',
//     price: 100
//   },
//   {
//     name: 'bbb',
//     price: 200
//   },
//   {
//     name: 'ccc',
//     price: 300
//   },
// ]
// var arr2 = arr.filter(function (item) {
//   return item.price > 120
//   // return true
// })
// console.log(arr2);
// every 每一个
// var arr = [90, 90, 92, 94]
// var arr2 = arr.every(function (item) {
//   return item >= 90
// })
// console.log(arr2);

// some 只要一个满足条件 就是true
// var arr = [90, 90, 2, 94]
// var arr2 = arr.some(function (item) {
//   return item >= 90
// })
// console.log(arr2);


// find  作用:在书中内查找满足条件的第一项  返回值:找到的数据 查找条件return 的形式书写
// 返回值:找到的数据,如果没找到返回的是undefined
// var arr = [
//   {
//     name: "语文",
//     grade: 90
//   },
//   {
//     name: "数学",
//     grade: 95
//   },
//   {
//     name: "体育",
//     grade: 100
//   },
// ]

// // var arr2 = arr.filter(function (item) {
// //   return item.grade === 100
// // }
// // )
// var arr2 = arr.find(function (item) {
//   return item.grade === 100
// })
// console.log(arr2);
// findIndex 语法:数组.findIndex(function(item,index,origin){}) 3个函数含义与foreach相同
// 作用:在数组内查找一个符合条件的第一项的下标
// 返回值:找到的数据的下标,如果没找到返回的是-1
// 查到条件以return的形式书写
var arr5 = [10, 20, 30, 40, 50]
var newArr = arr5.findIndex(function (item, index, origin) {
  return item > 20
})
console.log(newArr);
// reduce 叠加   回调函数  初始值
var arr = [1, 2, 3, 4, 5]

// var arr2 = arr.reduce(function (prev, item) {
//   return prev + item
// }, 0)
var arr2 = arr.reduce(function (prev, item, index, origin) {
  return prev + item
}, 0)
// var arr2 = arr.reduce(function (prev, item) {
//   return prev * item
// }, 0)

console.log(arr2);

数组去重

1.for循环+if(indexOf是否等于-1判断){}
2.利用对象

  var arr = [1, 2, 3, 4, 5, 6, 2, 1]
  var obj = {}
   for (var i = 0; i < arr.length; i++) {
      obj[arr[i]] = "随便"
    }
      console.log(obj);
   for (var i in obj) {
      console.log(i);
    }

3.new Set

var set1 = new Set(arr)
console.log(set1);
var arr1 = Array.from(set1)
console.log(arr1);

数组塌陷

var arr = [0, 1, 2, 3, 4, 5]
// for (var i = 0; i < arr.length + i; i++) {
//   if (arr.indexOf(i) === i) {
//     arr.splice(i, 1)
//     console.log(arr);
//   } else {
//     arr.splice(arr.indexOf(i), 1)
//   }
// }
for (var i = 0; i < arr.length; i++) {
  arr.splice(i, 1)
  i--
}
console.log(arr);

字符串的常用方法

  • charAt(索引) 返回索引对应地方字符
  • charCOdeAt(索引)返回索引对应的字符
  • 截取substr[开始索引,长度] substring[开始索引,结束索引]包前不包后 slice[开始索引,结束索引]包前不报后
  • replace 替换 -正则表达式
  • split 分割 join 连接字符
  • concat 连接字符串
  • trim 去掉首尾空格 trimStart() trimLeft() 去掉首空格 trimEnd() trimRight() 去掉尾空格