初学js -2

对象

  • 储存了一些基本数据类型的一个集合

    var obj= {
        key:value
        
        num:100,
        str:"uh",
        boo:ture
    }
    
  • 字面量的方式创建一个对象

    var obj = {}
    
    boj.name = ""
    boj.age = 18
    
  • 内置构造函数的方式创建对象

    var boj = new object()
    
    boj.name = ""
    boj.age = 18
    

对象的基本操作

//第一种
// 增 改
obj.name="xxx"

//查
console.log(obj.name)

//删除
delete obj.name

//第二种
//当 key值 命名有双引号时 这种不会报错
//增 改
obj["name"]="xxx"
//注意若不加引号,则会被认为是变量

//查
console.log(obj["name"])

//删
delete obj["name"]

对象的遍历

for(var i in obj){
    //获取key
    console.log(i)
    //获取value
    console.log(obj[i])
}

不同数据类型的存储

var obj ={
    name:"xxx",
    age:122
}
var obj2 = obj
obj2.name = "tiechui"
//最终 obj 和 obj2 都会被修改





var obj1 = {name:"xxx"}
var obj2 = {name:"xxx"}

obj1 == obj2
//此处为false

obj1 === obj2
//此处也为false

  • 变量 名和值 都存储在栈中;而对象的 存在栈中 而值在堆中 ,靠地址找到,直接赋值会将地址赋值给另外的对象,共用一个
    对象的复制可以用 for遍历 复制
var obj = {
    name : "kerwin",
    age:100,
    location: "dalian"
}

var obj2 = {}

for(var i in obj){
    
    obj2[i] = obj[i]
}

数组的类型

  • 数据的集合

    var Arr = [12,13,14]
    
    var arr1 = new Array (12,14,15,16)
    
    // 只写一个参数会创建位置数量
    var arr1 = new Array (12)
    

数据的基本操作

//length 可读可写
var arr1 =[ 1,2,3,4,8]


//将删除后面的两个元素,使之length为 3
arr1.length = 3

//清空数组。
arr1.length = 0


//索引 0 1 2
console.log(arr1[0])
//改
arr1[0]="a"
//在后面增加
arr1[5]="b"

//遍历
var arr3 = [3,4,5,6,7,8]
for(var i=o; i<arr3.length; i++){
    console.log(arr3[i])
}
//复制
var arr4 =[]
for(var i=0; i<arr3.length; i++){
    arr4[i] = arr3[i]
}

数组的常用方法-1

var arr =[1,2,3]

// push后面追加元素,
// 返回值长度
var res = arr.push( "kerwin" )
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删除
// 返回值为删除的值的数组
// arr2.splice(开始索引,删除的步长)
var arr2 = [ "kerwin" , "xiaoming" , "tiechui"]
var ressplice = arr2.splice(1,2)
console.log(arr2)
console.log("返回值",ressplice)
// 此处返回值为 ["xiaoming" , "tiechui"]


// splice增加
// arr2.splice(开始索引,删除的步长,增加的内容)
var arr2 =[ "kerwin" , "xiaoming" ,"tiechui"]
var ressplice = arr2.splice(1,0, "gangdaner" , "zhugeshanzhen")
// 此处 删除步长 为0 所以为直接增加
console.log(arr2)
console.log("返回值", ressplice)

// resver倒序
// 将数组倒过来
var arr3 = [2,1,3,4]
arr3.reverse()
//输出为 [4,3,1,2]


// sort排序
// sort 不传参数不能按照数学大小排序
var arr4 = [11,21,3,56,7]
// arr4.sort()
// sort接受一个回调函数
// a,b 随便写  a-b是从小到大 b-a是从大到小
arr4.sort( function(a,b){
    return b-a
})
console. log(arr4)


数组常用方法-2

// 不影响原数组的方法
// concat拼接 第二个参数可以再写想加入的
var arr1= [1,2,3]
var arr2 =[4,5,6]
var arr3 = arr1.concat(arr2,7,[8,9])
console.log(arr1,arr2,arr3)
// 在 arr1 后拼接 arr2

//一种数组复制方式,不会影响相互,但里面元素复杂时可能会出现问题
var arr4= arr1.concat()


// join 数组 => 字符串
// 可指定使用分隔符
var arr = [1,2,3,4,5]
document.write(arr.join("-"))

// slice截取(开始索引,结束索引) 包前不包后(左闭右开区间)
var arr = [ "aaa" , "bbbb" , "ccc" , "ddd" , "eeee"]
var arr2 = arr.slice(0,2)
// 只写一个参数表示 索引值到最后一个 包含最后一个
var arr2 = arr.slice(2)
// 不写参数可用于 复制数组
var arr2 = arr.slice()
// 负数 表示从后面开始数 最后一个为 -1  同样包前不包后
var arr2 = arr.slice(2,-1)


// indexOf 查找指定内容在数组中的索引  成功返回索引  -1为找不到
// 第一个参数为 查找的内容  第二个参数为开始查找的索引
var arr =[ "aaa" , "bbb" ,"ccc" , "ddd" , "eee" , "aaa"]
var res = arr.indexOf ( "aaa",2)

// lastindexOf 从后面开始找
// 第一个参数为 查找的内容  第二个参数为开始查找的索引
var res = arr.lastindexOf ( "aaa",2)  // 从第二个开始往前找

数组去重

  • 创建一个空数组 将 要去重的数组 的值放进空数组,放之前先判断该内容是否存在

  • 利用对象 将数组内容赋给对象 key值,然后去出 key值 即为去重后的内容

  • new Set Set 不允许有重复内容

    var set1= new Set(arr)
    // 转回数组
    var arr1 =Array.from(set1)
    
    
    

数组的基本操作-3

var arr = [ "aaa" , "bbb", "ccc" , "ddd" ]
// foreach 遍历
// 回调函数
arr.forEach(function(item,index,arr){  //item 为值  index为索引   arr 为原数组
    console.log(item,index,arr)
})


// map 映射
var arr2 = arr.map(function(item){     //item 为arr的值
    return item*item*item              //return 什么就会将值变为什么 将arr的值立方后赋值给arr2
})
console.log(arr2)


// filter 过滤
var arr = [100,200, 300]
var arr2 = arr.filter(function(item){
    return item>200                    //return ture就将item加入arr2  false则不加
})


// every 每一个
var arr =[90,90,2,94]
var arr2= arr.every(function(item){
    return item>=90                    // 如果 arr每项 都大于等于90,则返回ture 否则返回false 即arr2为ture/false
})

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

// find
// 只能找到遇见的第一项
var arr2= arr.find(function( item){
     return item.grade===100
})

// reduce 添加
var arr =[1,2,3,4,5]
// prev 为上一次return的值  0为初始值(prev第一次的值)
var arr2= arr.reduce(function(prev,item){
    return prev+item
},0)

// 第一次 prev 0 item 1 
// 第二次 prev 1 item 2
// 第三次 prev 3 item 3
// 第四次 prev 6

字符串的基本操作

var str1 = "hello"
console.log(str1+" world")

var str2 =new String ( "hello")   // 但还是 基本数据类型 ,复制更改其中一个不会相互影响
console.log(str2+ " world")       // 一样也能拼接
// 效果一样

// length 只读
str1.length
// 索引 只读
str1[1]
// 遍历

字符串出现的次数

var obj = {}
for(var i=o;i<str.length;i++){
    var key = str[i]
    if(obj[key] === undefined){
        obj[key] = 1
    }else{
        obj[key]++
         }
    
  // 或者  
    
    if(obj[key]){
        pbj[key]++
    }else{
        obj[key] = 1
        }
    }

字符串常用方法

// charAt(索引)返回索引对应的字符
var str = "kerwin"
var str1 = str.charAt(2)
console.log(str, str1)

// charcodeAt(索引)返回索引对应的字符编码
var str1 = str.charCodeAt(0)
console.log(str1)

// fromCharcode(i) 把编码转化为对应的字符

// toUppercase()  转大写
// toLowerCase()  转小写

// 截取
// substr(开始索引,长度)
// substring(开始索引,结束系引) 左闭右开
// S1ice(开始索引,结束索引)
var str = "kerwin"
var str1 = str.substr(1,2)

var str2 = str.substring(1,2)
var str3 = str.substring(1)

var str4 = str.slice(1,2)
var str5 = str.slice(1)
var str5 = str.slice(1,-1)

console.log(str1,str2,str3,str4,str5)


// replace 替换
// 只能替换第一个
var str ="abdwadwa"
var str1 = str.replace( "a" , "*")


// split 分割
// 返回一个数组
var str = "a|b|c|d"
console.log(str.split("|"))
// 如果不写参数 就会把每个字符作为元素


// indexOf lastIndexOf


// concat 连接字符串

// trim 去掉首尾空格
// trimStart() trimLeft()去掉首空格
// trimEnd()   trimRight()去掉尾空格

模糊查询

var arr= ["aaa" , "abc", "bcc" , "bcd" , "ddd" , "ccd"]
// 数组的filter字符的indexOf
var res = arr.filter(function(item){
    var input = prompt("请输入查询的内容")
    return item.indexOf("b")>-1
})
console. log(res)

json格式字符串

// json字符串==》对象
// json{ "key":110, "key" : "123"} key值要加引号
var str = '{ "name" : "kerwin" , "age" : 100} '
// 将json转str
var obj = JSON.parse(str)
// 转json
var str1 = jSON.stringify(obj1)

模板字符串

  • 反引号
var myname = "kerwin"
var str = `my name is ${myname} ${10+20} ${10>20?'aaa' : 'bbb'``
document.write(str)

数字常用方法

// toFixed() 保留小数位数 会四舍五入  
// 返回值是 字符串
var price = 123.45678
console.log(price.toFixed(2))

// Math 对象
console.log(Math)
// 查看


// random  [0,1)的随机数 
console.log(Math.random)

// round 四舍五入取整
console.log(Math.round(4.56))

// ceil向上取整 
// floor向下取整
console.log (Math.floor(4.96))

// abs 绝对值

// sqrt 平方根

// pow(底数,指数)
console.log (Math.pow(3,3))

// max() 取出最大 可写多个参数
// min() 取出最小 可写多个参数

// PI   圆周率

时间对象

var time = new Date()

// new Date传参
// 1个传参 毫秒数
// 1970 1 1 0:0:0 开始的毫秒数
var date1= new Date ( 10000)
// 多个参数为年月日时分秒
// 注意 月是 0 开始的
var date1= new Date (2023,10,2,10,10,10)
// 字符串
var date3= new Date("2023-10-10 10:10:10")
var date3= new Date( "2023/10/10 10:10:10")

console.log(date1)


时间对象常用方法

// 获取年 月 日 周 时 分 秒  
//getFullYear()
console.log(date.getFullYear())
//getMonth() 
//0-11===>1-12
console.log(date.getMonth())
//getDate()
console.log(date.getDate())
//getDay()周日0周一-周六1-6
console.log(date.getDayO)
// 时分秒
console.log(date.getHours())
console.log(date.getMinutes())
console.log(date.getSeconds())
console.log(date.getMiiliseconds())
// 时间戳
console.log(date.getTime())

// 设置
date.setFullYear( 2025)

date.setMonth(5)

date.setDate(25)

date.setHours (13)

date.setMinutes (50)

date.setSeconds (59)

date.setTime (59)

定时器

//注册延时定时器  做一次
// 单位毫秒
setTimeout(function(){
    console.log( "kerwin")
},2000)

//注册间隔定时器  不断做
setInterval(function(){
    console.log(new Date(i))
},1000)

// 以上 定时器 返回值 为注册顺序

// 清除定时器
var = setTimeout(function(){
    console.log( "kerwin")
},2000)
var = setInterval(function(){
    console.log(new Date(i))
},1000)

clearTimeout(time1)
clearInterval(time2)

// 不论时间多短 function内都是异步 先执行完同步 再执行异步
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 入门与进阶 第一章 进入编程 1,如何快速运行一段js代码? 方式1:浏览器开发者工具。可以使用快捷键option...
    潇潇潇潇潇潇潇阅读 4,342评论 0 0
  • 一,JavaScript的书写格式 1.行内脚本:写在HTML标签内部,通过一个属性节点来添加,不推荐使用,例如“...
    刘远舟阅读 3,382评论 0 0
  • 每日一题 以下哪个会打印出"3"?3.toString() //报错 Uncaught SyntaxError...
    咸小七阅读 3,030评论 0 0
  • 第五章******************************************************...
    fastwe阅读 3,978评论 0 0
  • 常用: (typeof who) //判断这个是那种类型 typeof; (isNaN(who)) //判断是否数...
    侠克阅读 451评论 0 0