前端学习——08——命名空间和对象枚举

野生小米椒

已于 2022-06-08 15:42:02 修改

阅读量274

点赞数

分类专栏：三大基础语言文章标签：前端学习 javascript

于 2019-08-31 17:51:33 首次发布

本文链接：https://blog.csdn.net/x1037490413/article/details/100175425

版权

三大基础语言专栏收录该内容

144 篇文章 9 订阅

订阅专栏

命名空间：管理变量，防止污染全局，适用于模块化开发

多人开发时相同命名怎么避免互相污染，可以用闭包解决，私有化变量

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      var name="ss"
       var init=(function () {
        var name = "x";
        function callName() {
          console.log(name);
        }
        return function () {
          callName();
        };
      }())

      var initDeng=(function(){
        var name=123
         function callName() {
          console.log(name);
        }
        return function () {
          callName();
        };
      }())
      init()
      initDeng()
    </script>
  </body>
</html>

连续调用，如果没有返回值，函数里会隐式执行return undefined，所以要想实现连续调用需要return this

隐式地转换成obj['name'],是字符串，不是变量，因为是字符串所以可以实现属性名的拼接

属性拼接:

 <script>
    var sports = {
      way1: {
        name: 'run'
      },
      way2: {
        name: 'jump'
      },
      way3: {
        name: 'swim'
      },
      way4: {
        name: 'climb'
      },
      chooseWay: function (num) {
        //字符串拼接
        return this['way' + num];
      }
    }
    /*
    obj.name---->obj['name']  name要加引号,不是变量
    */
  </script>

对象枚举:

在不知道长度的情况下，可使用for in循环，因为对象没有length属性，这是专门给对象使用的，对象有多少个就循环多少圈，且会把属性名赋给prop(可换名字),数组是特殊的对象，也可使用，这时的prop代表索引位

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
  var obj={
    name:'x',
    age:12,
    sex:"woman",
  }
  for(var key in obj){
    //想打印出属性值
    // 底层会进行隐式转换obj.key--->obj['key'] 就不是变量了，是定量，会找key这个属性，找不到就undefined
    // console.log(obj.key);
    //所以应该这样写，在枚举中只能这样写，别的地方可以.
    console.log(obj[key]);
  }
    </script>
  </body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Document</title>
</head>
<body>
   
<script>
    //实现一个方法的连续调用
	//例一
	var deng={
		smoke:function(){
			console.log('smoke');
                   //隐式返回 return undefined
                    //所以要加return this
			return this;//实现一个方法的连续调用
		},
		drink:function(){
			console.log('drink');
			return this;
		},
		perm :function(){
			console.log('perm');
			return this;
		}
	}
    deng.smoke().drink().perm().smoke();

     //例二
	//对象的枚举 
	//for in
	//遍历对象,得到每个属性的值
  var obj={
	  name:'13',
	  age:123,
	  sex:"male",
	  height:180,
	  weight:75
  }
  for(var prop  in obj){
	  console.log(prop);
    /*
  obj.name--->obj['name']
  obj.prop相当于obj['prop']  这样的话不会把prop当作变量了,而是属性(定量),访问不了,
  在其他的地方访问属性可以用.,但是在枚举中不能用.
   */
	  console.log(obj[prop]);//不能用obj.prop  数组可以，数组是引用值，可以访问方法
  }
  //hasOwnProperty()过滤性方法，看看属性是否属于自己的 过滤掉原型链上的方法  属性自己的方法返回true,不属于则返回false
//注意一点是，自己添加的原型会打印出来，系统的不会
  var obj={
	  name:'13',
	  age:123,
	  sex:"male",
	  height:180,
	  weight:75,
	  _proto_:{
    lastName:"deng"
	  }
  }
  Object.prototype.abc='yun'
  for(var prop in obj){
	  if(obj.hasOwnProperty(prop))
	  {
		  console.log(obj[prop]);
	  }
  }

  for(var prop in obj){
	  if(!obj.hasOwnProperty(prop))
	  {
		  console.log(obj[prop]);
	  }
  }
     //例三
	//in在控制台要将属性变成字符串形式，存在是true，不存在是false
	//hasOwnProperty看这个属性是不是这个对象的  而in是在对象上能不能调用这个属性，原型上也算(用得少)

	var obj={
	  name:'13',
	  age:123,
	  sex:"male",
	  height:180,
	  weight:75,
	  _proto_:{
    lastName:"deng"
	  }
  }
  
</script>
</body>
</html>

例三：属性名是字符串,不加字符串的是变量,会报错的

in和hasOwnProperty的区别是,不论是自己的还是系统的,都一起判断

//例四
  //A instanceof B  A对象是不是B构造函数构造出来的，就是看A对象的原型链上有没有B的原型

instanceof可以用来判断一个变量是对象还是数组,有两种判断方法

1.constructor

 <script>
    //不能直接用{}.constructor 因为大括号还有可能代表function(){}
    var obj = {}
  </script>

方法2:instanceof

方法3:toString 谁调用this就指向谁,用call改变this指向

野生小米椒

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
前端学习——08——命名空间和对象枚举

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compat...
复制链接

扫一扫

专栏目录