练习五、判断传值是否为对象；Promise与setTimeout的使用

akatsuki七

已于 2023-03-24 16:59:57 修改

阅读量136

点赞数

分类专栏：个人练习文章标签： javascript elementui 前端算法

于 2023-03-23 21:52:38 首次发布

本文链接：https://blog.youkuaiyun.com/Ak47a7/article/details/129740152

版权

个人练习专栏收录该内容

10 篇文章

订阅专栏

文章介绍了如何编写一个JavaScript函数来判断传入值是否为对象，探讨了Vue中数据处理对原型链的影响，以及Promise与setTimeout的结合使用，包括如何在5秒后返回一个值。同时，文章提到了在使用setTimeout时的常见问题，如参数传递和作用域的理解。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

功能描述：

题目一：写一个函数判断传值是否为对象

题目二：写一个函数，利用Promise在5秒后返回一个值

主要考点：

题目一：对象的基本格式，判断传入变量值是否是对象的方法

题目二：Promise实例的使用与setTimeout（）函数的使用

踩到的坑：

问题1：其中为什么从data函数中拿到的数组，使用value.__proto__ === Array.prototype 返回结果是false呢？

解答1：个人感觉原因是Vue 将 data 中的数组，进行原型链重写。

问题2：setTimeout()，第一个参数直接写console.log(),运行直接打印出结果

解答2：要么直接加"console.log()"，代表传递是个方法（在全局变量中查找）;要么加()=>{}箭头函数，代表传递是个函数指向后面{}(在局部变量中查找)。

问题3：promise是什么？怎么使用？为什么需要这样写？

解答3：promise原理之后单独学习

使用框架或语言：

elementui ，js

相关代码：

<script>
export default {
  data(){
    return{
      objectInfo:{
        name:'小孩',
        age:10,
        work:'student'
      },
      stringInfo:'123344444',
      arrayInfo:[1,23,45,64,22],
      numberInfo:12,
      nullInfo:null,
      undefinedInfo:undefined,
    }
  },
  mounted(){
    //题目一
    this.check(this.objectInfo)
    this.check(this.stringInfo)
    this.check(this.arrayInfo)
    this.check(this.numberInfo)
    this.check(this.nullInfo)
    this.check(this.undefinedInfo)

    //题目二
    this.countOut().then(outPrint => console.log(outPrint))

    this.timeOut()
  },
  methods:{
    check(value){
      // 题目一：写一个函数判断传值是否为对象
      //1.对象的基本格式是什么？data中的objectInfo
      //2.判断传入变量值是否是对象的方法,typeOf判断数组,null也为object,需要通过逻辑判断去除

      //遇到的问题：
      // var arr = [1,23,45,64,22];
      // 其中为什么从data函数中拿到的数组，使用value.__proto__ === Array.prototype 返回结果是false呢？
      // 个人感觉原因是Vue 将 data 中的数组，进行原型链重写。
      // console.log(value,value.__proto__,Array.prototype)
      // console.log(arr,arr.__proto__,Array.prototype)

      if(value === null){
        //判断是null，返回false，不是{X:X,Y:Y}的对象
        console.log('typeof判断',value,false)
      }else if(value instanceof Array){
        //判断是数组，返回false，不是{X:X,Y:Y}的对象
        console.log('typeof判断',value,false)
      }else if(typeof(value) == 'object'){
        //判断是{X:X,Y:Y}的对象，返回
        console.log('typeof判断',value,typeof(value))
      }else{
        //其它判断，返回false
        console.log('typeof判断',value,false)
      }
    },

    countOut(){
      // 题目二：写一个函数，利用Promise在5秒后返回一个值

      //踩到的坑：
      //问题1：setTimeout()，第一个参数直接写console.log(),运行直接打印出结果
      //解答1：要么直接加"console.log()"，代表传递是个方法（在全局变量中查找）
      //      要么加()=>{}箭头函数，代表传递是个函数指向后面{}(在局部变量中查找)
      //      两者的区别在于查找的作用域不相同
      //问题2：promise是什么？怎么使用？为什么需要这样写？
      //解答2：promise原理之后单独学习
      return new Promise((resolve,reject) => {
        setTimeout(resolve,5000,'out')
      })

    },

    timeOut(){
      function fun(){
      console.log(2)
    }
      setTimeout(fun,3000)
    },


  }
}
</script>

运行截图：