详解js访问对象的属性和方法


Posted in Javascript onOctober 25, 2018

对象的属性和方法统称为对象的成员。

访问对象的属性

在JavaScript中,可以使用“ . ”和“ [ ] ”来访问对象的属性。

二者区别:“ . ”表示法一般作为静态对象使用时来存取属性。而“[ ]”表示法在动态存取属性时就非常有用。

var object = {name:'xiaoming',age:29};
var name1 = object.name;var name2 = object['name'];

访问对象的方法

在JavaScript中,只能用“ . ”来访问对象的方法。

function Person(){
  this.name = 'xiaoming';
  this.age = 29;
  this.say = function(){
    alert('This is person');
  }     
}
var student = new Person();
alert(student.name);
alert(student['age']);
student.say(); //使用" . "访问对象方法

引申出的两个题目:

1.判断一个字符串中出现次数最多的字符,统计这个次数

var str = 'Thisthebesttimesewerty';
var obj = {};
for(var i=0; i<str.length;i++){
  var char = str[i];
 // var char = str.charAt(i); //charAt()可返回指定位置的字符,i为字符的下标,从0开始
  if(obj[char]){
    obj[char]++; //char是obj对象的一个属性,如果存在次数加1
  }else{
    obj[char] = 1; //如果不存在,保存在obj中并计数为1
  }
}
 
var max = 0;
var maxChar = null;
for(var key in obj){
  if(max < obj[key]){
    max = obj[key]; //出现最多次数max
    maxChar = key; //出现次数最多的字符maxChar
  }
}

2.编写arraysSimilar函数,实现判断传入的两个数组是否相似。

具体需求:

1. 数组中的成员类型相同,顺序可以不同。例如[1, true] 与 [false, 2]是相似的。

2. 数组的长度一致。

3. 类型的判断范围,需要区分:String, Boolean, Number, undefined, null, 函数,日期, window.

当以上全部满足,则返回"判定结果:通过",否则返回"判定结果:不通过"。

function arraysSimilar(arr1,arr2){
  if(!(arr1 instanceof Array) || !(arr2 instanceof Array)){
     return false;
  }  
  if(arr1.length !== arr2.length){
     return false;
  }
 
  var i=0, n=arr1.length, countMap1={}, countMap2 = {}, t1, t2,
  TYPES = ['string','boolean','number','undefined','null','function','date','window'];
 
  for(i; i<n; i++){
     t1 = typeOf(arr1[i]);
     t2 = typeOf(arr2[i]);
     if(countMap1[t1]){
       countMap1[t1]++;
     } else{
       countMap1[t1] = 1;
     }
 
    if(countMap2[t2]){
       countMap2[t2]++;
     } else{
       countMap2[t2] = 1;
     }
  }
 
  for(i=0; i<TYPES.length; i++){
    if(countMap1[TYPES[i]] != countMap2[TYPES[i]]){
      return false;
    }
  }
  return true;
}
 
function typeOf(ele){
  var r;
  if(ele === null){
    r = 'null';
  }
  else if(ele === 'window'){
    r = 'window';
  }
  else if(ele instanceof Array){
    r = 'array';
  }
  else if(ele instanceof Date){
    r = 'date';
  }
  else{
    r = typeof(ele);
  }
  return r;
}
Javascript 相关文章推荐
JavaScript延迟加载
Mar 09 Javascript
JavaScript正则表达式匹配 div  style标签
Mar 15 Javascript
javascript的document中的动态添加标签实现方法
Oct 24 Javascript
Angular企业级开发——MVC之控制器详解
Feb 20 Javascript
利用vue+elementUI实现部分引入组件的方法详解
Nov 22 Javascript
vue 实现在函数中触发路由跳转的示例
Sep 01 Javascript
JavaScript指定断点操作实例教程
Sep 18 Javascript
详解vscode中vue代码颜色插件
Oct 11 Javascript
解决layer.confirm快速点击会重复触发事件的问题
Sep 23 Javascript
javascript实现简单打字游戏
Oct 29 Javascript
详解ES6 中的Object.assign()的用法实例代码
Jan 11 Javascript
vue elementUI批量上传文件
Apr 26 Vue.js
深入浅析js原型链和vue构造函数
Oct 25 #Javascript
AngularJS 多指令Scope问题的解决
Oct 25 #Javascript
jQuery+Datatables实现表格批量删除功能【推荐】
Oct 24 #jQuery
webpack打包非模块化js的方法
Oct 24 #Javascript
如何实现一个webpack模块解析器
Oct 24 #Javascript
vue项目中使用Svg的方法
Oct 24 #Javascript
js中获取URL参数的共用方法getRequest()方法实例详解
Oct 24 #Javascript
You might like
php &amp;&amp; 逻辑与运算符使用说明
2010/03/04 PHP
微信支付开发发货通知实例
2016/07/12 PHP
PHP实现链式操作的三种方法详解
2017/11/16 PHP
PHP基于递归算法解决兔子生兔子问题
2018/05/11 PHP
php实现获取近几日、月时间示例
2019/07/06 PHP
PHP如何通过date() 函数格式化显示时间
2020/11/13 PHP
javascript 时间比较实现代码
2009/10/28 Javascript
Javascript 面向对象编程(coolshell)
2012/03/18 Javascript
javascript操作JSON的要领总结
2012/12/09 Javascript
通过AJAX的JS、JQuery两种方式解析XML示例介绍
2013/09/23 Javascript
jQuery+Ajax实现无刷新操作
2016/01/04 Javascript
JavaScript资源预加载组件和滑屏组件的使用推荐
2016/03/10 Javascript
Angular2内置指令NgFor和NgIf详解
2016/08/03 Javascript
详解JS中的柯里化(currying)
2017/08/17 Javascript
在node中使用jwt签发与验证token的方法
2019/04/03 Javascript
如何获取vue单文件自身源码路径
2019/05/06 Javascript
d3.js实现图形拖拽
2019/12/19 Javascript
JS数组进阶示例【数组的几种函数用法】
2020/01/16 Javascript
electron踩坑之remote of undefined的解决
2020/10/06 Javascript
Python实现批量检测HTTP服务的状态
2016/10/27 Python
Python实现按特定格式对文件进行读写的方法示例
2017/11/30 Python
对python 各种删除文件失败的处理方式分享
2018/04/24 Python
python通过伪装头部数据抵抗反爬虫的实例
2018/05/07 Python
对Python 两大环境管理神器 pyenv 和 virtualenv详解
2018/12/31 Python
Python爬虫实现百度翻译功能过程详解
2020/05/29 Python
Python自动巡检H3C交换机实现过程解析
2020/08/14 Python
python连接mongodb数据库操作数据示例
2020/11/30 Python
html5 Canvas画图教程(8)—canvas里画曲线之bezierCurveTo方法
2013/01/09 HTML / CSS
介绍一下Java中标识符的命名规则
2014/02/03 面试题
高级Java程序员面试题
2016/06/23 面试题
学校七一活动方案
2014/01/19 职场文书
初中化学教学反思
2014/01/23 职场文书
销售员工作检讨书(推荐篇)
2014/10/18 职场文书
2015新生加入学生会自荐书
2015/03/24 职场文书
2015年度培训工作总结范文
2015/04/02 职场文书
入伍通知书
2015/04/23 职场文书