前端JavaScript-面向对象

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title></head><body><script>/*函数不能重名定义 会覆盖*//*this 相当于self*/                //在 JavaScript中函数是一等公民.//创造对象的构造器方法*/function Student(name,age) {this.name = name;this.age = age;}Student.prototype.study =function(courseName) { /*将学生绑定在学习行为上*/window.alert(this.name +'正在学习' +courseName + '.');};Student.prototype.watchAv = function() {    /*将学生绑定在看电视行为上*/if (this.age >= 18) {window.alert(this.name + '正在观看到过电影.');}else {window.alert(this.name + '只能观看《熊出没》');}};var stu1 = new Student('孙潇',28); /*这里的new一定要写*/var stu2 = new Student('王大锤',17);stu1.study('python')stu2.watchAv();</script></body>
</html>

打开浏览器如下弹框：

这是一个生活中上网经常遇到的，等待倒计时后去到相应网站跳转：

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title></head><body><p><span id = 'counter'>5</span>秒钟后自动跳转到百度...</p><script>var seconds=5;window.setTimeout ( function ()  {seconds -= 1;if (seconds == 0){location.href='http://www.baidu.com';}else {document.getElementById('counter').textContent = seconds;window.setTimeout(arguments.callee,1000);}},1000);</script></body>
</html>// 下面是要给弹框的效果，但是已经被淘汰了，太多浏览器会屏蔽这个东东了：
//
//          window.open('http://www.baidu.com','此处是广告')
//          /*以前的广告 但是现在很多浏览器都会屏蔽弹框的功能*/
//          /*弹框是比较差的用户体验，尽量不要弹*/
//          var name = window.prompt('请输入你的名字');
//
//          if (!!name && name != 'null') {
//              window.alert('你好，' + name +'!');
//          }else {
//              window.alert('大家好！');
//          }
//          if (window.confirm('确定要退出吗？')){
//              window.close(); /*有些浏览器不支持这个close*/
//          }
//      }

然后会做一个完整简单的网页。先到这里吧，好多东西还得研究研究

前端JavaScript-面向对象相关推荐

JavaScript面向对象实现-坦克大战（附前端全套学习路线）
[课程简介] 使用javascript+面向对象实现一个坦克大战游戏,让更多的同学能更加深入地理解面向对象思想. [主讲内容] 1. 讲解什么是面向对象,javascript中如何实现面向对象 2. ...
前端 JavaScript 设计模式前奏--面向对象-封装、继承、多态
JavaScript 面向对象如图所示: 1. 什么是面向对象 1. 面向对象的概念 2. 面向对象的三要素: 继承/封装/多态 ⭐️ 3. JS 的应用举例 4. 面相对象的意义 --- 数据结构 ...
《JavaScript面向对象精要》读书笔记
JavaScript(ES5)的面向对象精要标签: JavaScript 面向对象读书笔记 2016年1月16日-17日两天看完了<JavaScript面向对象精要>(参加异步社区的活 ...
《JavaScript面向对象编程指南》——第1章引言1.1 回顾历史
本节书摘来自异步社区<JavaScript面向对象编程指南>一书中的第1章,第1.1节,作者: [加]Stoyan Stefanov 译者: 凌杰更多章节内容可以访问云栖社区" ...
《javascript面向对象编程指南》读书笔记
<javascript面向对象编程指南>读书笔记 <javascript面向对象编程指南>读书笔记第一章面向对象的JavaScript 第二章基本数据类型与流程控制变量 ...
前端---JavaScript基础2
文章目录前端---JavaScript基础2 对象类型判断 call函数对象属性操作深拷贝方法前端-JavaScript基础2 重构以下代码:(以面向对象的方式) 重构后:(其中this指针问 ...
前端---JavaScript基础1
文章目录前端---JavaScript基础1 数据类型面向对象对象创建方式对象类型判断前端-JavaScript基础1 JS是解释型语言:跨平台慢编译型语言:不能跨平台快数据类型 ...
前端面试面向对象_面向初级前端开发人员的面试问题
前端面试面向对象 The purpose of this article is to familiarize fresh Front-End Web Developers with text book ...
ajax小猿圈面试题,小猿圈之2019年前端JavaScript面试题（二）
小猿圈前端讲师今天继续给你总结js面试题,前面一篇文章咱们已经有一片js基础部分面试题,今天小猿圈web讲师为你讲解js前端应用设计问题,一定要好好看哦,为了能赢在其他人前面. JavaScript前 ...
【笔记-面试】《imooc -前端跳槽面试技巧》、《imooc- 揭秘一线互联网企业前端javaScript高级面试》、《imooc-前端javascript面试技巧》
20190204:<imooc -前端跳槽面试技巧> 第01章课程介绍 01-01 课程导学一.一面知识点 1.面试技巧页面布局类 2.css盒模型dom事件类 3.http协议类 ...

前端JavaScript-面向对象

前端JavaScript-面向对象相关推荐

最新文章

热门文章