码迷,mamicode.com
首页 > Web开发 > 详细

js面向对象编程笔记

时间:2015-05-21 08:54:50      阅读:155      评论:0      收藏:0      [点我收藏+]

标签:

1. 基础

面向对象实例

技术分享
function Lecture(name, teacher) {
  this.name = name;
  this.teacher = teacher;
}
Lecture.prototype.display = function () {
  return this.teacher + ‘ is teaching ‘ + this.name;
}
//var le = new Lecture(‘数学‘, ‘李四‘);
//console.log(le.display());

function Schedule(lectures) {
  this.lectures = lectures;
}
Schedule.prototype.display = function () {
  var str = ‘‘;
  for (var i = 0; i < this.lectures.length; i++) {
    str += this.lectures[i].display() + ‘\n‘;
  }
  return str;
}
var sc = new Schedule([
new Lecture(‘yuwen‘, ‘aaa‘),
new Lecture(‘shuxue‘, ‘bbb‘),
new Lecture(‘wuli‘, ‘ccc‘)
]);
sc.display();
View Code

操作页面元素实例

技术分享
<!DOCTYPE html>
<html>
<head>
<script>
window.onload = function() {
    var lis = document.getElementsByTagName(li);
    for (var i = 0; i < lis.length; i++) {
        lis[i].style.border = 1px solid #f00;
    }
    var item1 = document.getElementById(item1);
    item1.parentNode.removeChild(item1);
}
</script>
</head>
<body>
<ul>
    <li id="item1">item1</li>
    <li id="item2">item2</li>
    <li id="item3">item3</li>
    <li id="item4">item4</li>
</ul>
</body>
</html>
View Code

鼠标移入移出事件实例

        lis[i].onmouseover = function() {
            this.style.backgroundColor = ‘blue‘;
        }
        lis[i].onmouseout = function() {
            this.style.backgroundColor = ‘white‘;
        }

2. 面向对象

对象是javascript的基本单位,js中的一切都是对象。下面介绍引用、作用域、闭包以及上下文。

引用就是指向对象实际位置的指针。

作用域就是变量的有效区域,在js中作用域由函数约束而不是由块约束。

闭包表示内部的函数可以引用包含它的外层函数中定义的变量,即使外层函数已经执行完毕。

上下文通过变量this工作。变量this总是引用代码当前所在的那个对象。

js面向对象编程笔记

标签:

原文地址:http://www.cnblogs.com/feilv/p/4518757.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!