window对象-BOM-DOM-ECMA

window对象-8.17

by 曾庆林

复习

  1. 数组的常见方法
  2. 数组的遍历3种方法
  3. 数组如何去重

作业讲解

随机生成指定长度的字符串
实现一个算法,随机生成指制定长度的字符串。
比如给定 长度 8  输出 4ldkfg9j


function randomString(n) {  
  // 包含所有字符的字符串
  var str = 'abcdefghijklmnopqrstuvwxyz9876543210';
  var tmp = '',
  // 临时的字符串变量 用来存取生成的随机字符串
      i = 0,
      l = str.length;
  for (i = 0; i < n; i++) { // 需要多长的随机字符串 就要循环多次次(也就是n次)
    tmp += str.charAt(Math.floor(Math.random() * l));
    // 随机取一个字符并加入 临时字符串中
  }
  return tmp; 
  //返回的随机字符串
}
 

判断一个单词是否是回文?

回文是指把相同的词汇或句子,在下文中调换位置或颠倒过来,产生首尾回环的情趣,叫做回文,也叫回环。比如 mamam   

很多人拿到这样的题目非常容易想到用for 将字符串颠倒字母顺序然后匹配就行了。其实重要的考察的就是对于reverse的实现。其实我们可以利用现成的函数,将字符串转换成数组,这个思路很重要,我们可以拥有更多的自由度去进行字符串的一些操作。

function checkRetrunWord(str) {  
   return str == str.split('').reverse().join('');
   // str.split('')字符串转换为数组
   // reverse() 将数组反转
   // join('') 将反转的数组转换为字符串
}


单词预习

  • parse | 转换
  • int | 整数
  • Float | 浮点数(小数)
  • NaN | not a number 不是一个数
  • BOM | (不用记)Browser Object Model 浏览器对象模型
  • DOM | (不用记)Document Object Mode 文档对象模型
  • history | 历史
  • location |地址
  • close |关
  • open |打开
  • back |返回
  • foword |前进
  • go | 去
  • reload | 重新加载

知识点讲解

4.1 常用window 系统对象

名称 说明
parseInt 将字符串转换为整型数字 如: parseInt ("86")将字符串“86”转换为整型值86
parseFloat 将字符串转换为浮点型数字 如: parseFloat("34.45")将字符串“34.45”转换为浮点值34.45
isNaN() 用于检查其参数是否是非数字
prompt 显示可提示用户输入的对话框
alert 显示带有一个提示信息和一个确定按钮的警示框
confirm 显示一个带有提示信息、确定和取消按钮的对话框
close 关闭浏览器窗口
open 打开一个新的浏览器窗口,加载给定 URL 所指定的文档
setTimeout 在指定的毫秒数后调用函数或计算表达式
setInterval 按照指定的周期(以毫秒计)来调用函数或表达式

4.2 javascript组成

image

1. EMCAScript

ECMAScript 不是一种编程语言,仅仅是一种脚本语言规范,由欧洲计算机协会制定和发布,任何基于此规范实现的脚本语言都要遵守它的约定。

ECMAScript 规定了 JavaScript 脚本的核心语法,如 数据类型、关键字、保留字、运算符、对象和语句等,它不属于任何浏览器。Web 浏览器对于 ECMAScript 来说只是一个宿主环境,但它并不是唯一的宿主环境。事实上,还有不计其数的其他各种环境(例如Macromedia 同时用在 Flash 和 Director MX 中的 ActionScript,如现在很火的nodejs)可以容纳 ECMAScript 实现。 也就是说除了我们常说的JavaScript是基于他实现的,另外还有其他的语言也是根据他实现的

2. BOM
浏览器对象模型是针对浏览器或者说是针对浏览器窗口的应用程序编程接口。这个概念实现就没有了标准规范了,都是根据各自浏览器厂商自定的规范实现的,但是也基本趋于一致。最多的像我们常用的navigator、window里的一些浏览器相关的对象、location等对象都是这个接口所提供的内容

image

  
  
3. DOM
文档对象模型(DOM,Document Object Model)是针对XML 但经过扩展用于HTML 的应用程序编程接口。DOM把整个页面映射为一个多层节点结构。HTML或XML 页面中的每个组成部分都是某种类型的节点,这些节点又包含着不同类型的数据。

举一个很简单的例子,我们所熟悉的getElementById函数是document对象下的一个方法。document对象就是DOM中定义的一个内容,浏览器实现了他,依据EMCAScript的特性,然后我们又可以通过他来获取到页面中的某一个节点,获取到的这个节点被实现为一个对象,他拥有许多属性和方法,这些属性和方法也是在DOM的定义下由浏览器实现的。但是DOM的这些实现依据的是EMCAScript规范所制定的语言的特性,所以这才会让我们误认为他们就是JavaScript,其实这个只是JavaScript的组成部分而已

image

4.3 window open 和close 方法

open() 方法用于打开一个新的浏览器窗口或查找一个已命名的窗口。

window.open(URL,name,specs,replace)

specs 参数不需要掌握
参数 说明
URL 打开指定的地址
name _blank _self
specs参数 height=100 高
width=100 宽
left=100 该窗口的左侧位置
top=100 窗口顶部的位置.
location=yes&#124no
1 0 是否显示地址字段.默认值是yes
menubar=yes
no 1 0 是否显示菜单栏.默认值是yes
resizable=yes
no 1 0 是否可调整窗口大小.默认值是yes
scrollbars=yes
no 1 0 是否显示滚动条.默认值是yes
status=yes
no 1 0 是否要添加一个状态栏.默认值是yes
titlebar=yes
no 1 0
是否显示标题栏.被忽略,除非调用HTML应用程序或一个值得信赖的对话框.默认值是yes
toolbar=yes
no 1 0 是否显示浏览器工具栏.默认值是yes

specs 谷歌只支持前四项目(咱们也就记 width height top left)

function open_win() { 
    window.open("http://www.520mg.com"); 
} 
function openWin(){ 
    myWindow=window.open('','_blank','width=200,height=100'); 
    myWindow.document.write("<p>这是'我的窗口'</p>"); 
    myWindow.focus(); 
}
function open_win(){
    window.open("http://www.520mg.com","_blank","toolbar=yes, location=yes,  status=no, menubar=yes, scrollbars=yes, resizable=no, width=400, height=400");
}

关闭窗口
自己打开的才能自己关闭

<script>
var myWindow;
function openWin(){
    myWindow=window.open("","","width=400,height=200");
}
function closeWin(){
    if (myWindow){
        myWindow.close();
    }
}
</script>
<input type="button" value="打开我的窗口" onclick="openWin()" />
<input type="button" value="关闭我的窗口" onclick="closeWin()" />

4.4 hsitory 对象

back() 后退历史记录
forward() 前进历史记录
go() 跳转到某个历史记录

4.5 location 对象

href 获取当前的地址 如果设置值是跳转到 设置地址
reload() 刷新(重新加载)

4.6 扩展

console.log(window)
console.log(window.location)

判断对象的数据类型 (* 面试必会被问到)

null:空、无。表示不存在,当为对象的属性赋值为null,表示删除该属性
undefined:未定义。当声明变量却没有赋值时会显示该值。可以为变量赋值为undefined
number:数值。最原始的数据类型,表达式计算的载体
string:字符串。最抽象的数据类型,信息传播的载体
boolean:布尔值。最机械的数据类型,逻辑运算的载体
object:对象。Array Math String Date Object

typeof  简单数据类型  typeof ”123“
instanceof 复杂数据类型  [] instanceof Array
constructor 检查构造函数 [].constructor == Object
Object.prototype.toString  最简单 Object.prototype.toString.call([])

复习

window 常用方法有哪些
默写 history 的方法
默写 location 对象的方法

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 160,277评论 4 364
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,777评论 1 298
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,946评论 0 245
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,271评论 0 213
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,636评论 3 288
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,767评论 1 221
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,989评论 2 315
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,733评论 0 204
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,457评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,674评论 2 249
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,155评论 1 261
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,518评论 3 258
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,160评论 3 238
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,114评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,898评论 0 198
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,822评论 2 280
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,705评论 2 273

推荐阅读更多精彩内容