一.学习概览:
1.JS的用途与发展史。
2.JS代码的基本规则。
3.JS的六大数据类型。
4.六大数据类型的互相转换、运算。
5.各种对象类型。
6.正则表达式。
二.学习详解:
这两周JS的学习与C语言有覆盖部分,所以覆盖部分和基本规则就不展开总结了。
1.Javascript的概念
a.JS是什么?
它是一种具有函数优先的轻量级,解释型或即时编译型的编程语言。虽然它是作为开发Web页面的脚本语言而出名,但是它也被用到了很多非浏览器环境中,JavaScript 基于原型编程、多范式的动态脚本语言,并且支持面向对象、命令式和声明式(如函数式编程)风格。
b.JS的主要功能
1.嵌入动态文本于HTML页面。
*2.对浏览器事件做出响应。(目前所学)
*3.读写HTML元素。(目前所学)
4.在数据被提交到服务器之前验证数据。
5.检测访客的浏览器信息。 控制cookies,包括创建和修改等。
6.基于Node.js技术进行服务器端编程。
2.六大基本变量
a.变量的声明
使用var关键字,对变量进行声明,例如:
和C语言不同的是,这样声明的变量会自动匹配类型。
b.变量的类型
变量分为六大类型,分为:
1.String 字符串
2.Number 数值 (Infinity、NaN也是number)
3.Boolean 布尔
4.Null 空
5.Undefined 未定义
6.Object 对象 (引用数据类型)
c.类型的转换
1)强制类型转换
1.String类型:
a.利用 x = x.toString(),返回值为变化后的新变量。(此方法对于Null和Undefined的变量无效)
b.直接调用String(),参数为要转化的变量。(类似的还有Number()等等)
2.Number类型:
a.调用Number():字符串–>数值,纯数字变为数字;如果有非数字则整体变为NaN;如果是一个或者多个空格,则变为"0"。
b.调用parseInt()或者parseFloat,用于获取字符串开头的数字串。(如果对非字符串类型使用,函数会先将其转化成字符串,再取数字。)
3.Boolean类型:
a.调用Boolean(),除了null、0、’\0’、undefined会转化为false,其他都是true。
2)隐式类型转换:
可以为一个任意数据类型取两次反,转化为Boolean类型。原理同Boolean()。
d.类型的运算
1)逻辑运算
1.与运算:
a.如果首数为false,则不检索另一个变量,直接返回false。
b.如果两个值都为true,则返回后者。(与短路规则有关!!!)
2.或运算:
a.如果首数为true,则不检索另一个变量,直接返回true。
b.如果两个值都为true,则返回后者。(与短路规则有关!!!)
2)关系运算符
1.用法:
a.比较大小,如果关系正确则返回true,否则返回false。
2.特殊情况:
a.对于非number,会先将其转化为number,再比较大小。
b.如果符号两端均为字符串,则会一位一位比较unicode编码。如果两位一样,则会继续往下一位比。(PS:可以用此对单词等排序,比较中文没有意义。)
c.如果要比较字符串类型的数字,需要先转数据类型,否则可能因为b情况导致结果不正确。
3)四则运算符(特殊情况)
1.任何值和NaN做运算,其结果都是NaN;字符串与字符串相加,会拼串;其他值与字符串相加,先转化为字符串,再拼串。
2."===“为全等号,只有完全相同才返回true。类型不同直接返回false。”!=="为不全等号。
3.空串的布尔值为false。
3.函数
a.创建(封装)
1.将要封装的代码以字符串的形式传给它。此法基本不用。
eg:var fun=new Function(“console.log(“this is a function.”)”)。
2.使用函数声明来创建函数(同c)。
3.使用函数表达式创建。和第二种大同小异。
b.构造函数*
1)定义
通过 new+函数名,来实例化对象的函数叫构造函数。它可以使同类对象的创建更加简单、灵活、高效。
2)实例
这里Person()就为一个构造函数,如图:
常见的构造函数还有:
-
创建数组的 var arr = new Array()。
-
创建对象的 var obj = new Object()。
-
创建日期对象的var date = new Date()。
c.回调函数
一些由我们创建但不由我们使用的函数,称为回调函数,意思是我们把函数传给浏览器,由浏览器决定怎么调用。数组的forEach方法、sort方法的参数需要一个函数,这个函数正是回调函数。(sort的回调函数用来指定排序方法)
4.引用数据类型:对象(object)
a.分类
1.内建对象:如Math String Number等等。
2.宿主对象:由js环境提供的对象,BOM、DOM(console.log,document.write等等)。
3.自定义对象:由开发人员自己创建。
b.创建
如 var a=new Object();
c.属性
1)定义
对象的属性是对象同一个类不同对象的区别。就好比两个人都是中学生,但他们的姓名、年龄、性别都可能不同,这里的姓名、年龄、性别就相当于学生这个对象的属性。(自己理解,不一定对)
2)语法与检测
对象.属性名=属性值。
PS:属性名的名称可不按标识符的命名规则。这时需用 对象[“属性名”] 来访问。eg: a.name=“Son”;
浏览器运行如下:
检测对象中是否有某个属性,有则返回true,否则false,如下:
d.原型(prototype)*
1)定义
每创建一个函数,解析器都会向其中添加一个属性prototype。此属性对应着一个对象,叫原型对象。当函数以构造函数的形式调用时,它所创建的对象中都会有一个隐含的属性指向原型对象,可通过__proto__属性访问。每一个实例都可以访问到这个类的原型对象。(PS:Object对象的原型没有,其就是原型;普通的原型一般有2层原型)
2)作用
当我们使用一个属性时,会先在本身对象里找,如果没有再去原型中找。所以以后在创建构造函数的时候,可以将他们共有的属性统一添加到构造函数的原型对象中。
3)方法
1.可以使用hasOwnproperty()方法检查对象自身是否具有某个属性。
2.当我们直接在页面中打印一个对象时实际上是输出对象的toString()方法的返回值。所以可以通过修改原型的toString()方法的返回值来改变直接打印对象的输出。
e.window、this与arguments*
1)window
全局作用域中,存在一个全局对象window。它代表的是浏览器的一个窗口,由浏览器创建,可直接使用。创建的变量都会作为window对象的属性保存。创建的函数都会作为window对象的方法保存。
(PS:想在函数作用域中直接访问全局变量,可以用window.变量名)
2)this
解析器每次都会向函数内部传递一个隐含的参数——this,被称为函数执行的上下文对象。根据函数调用方式的不同,this会指向不同的对象:
1.以函数形式调用,this永远都是window。
2.以方法的形式调用,this就是调用方法的那个对象。
3)arguments
在调用函数时,浏览器每次都会传进两个隐含的参数:
1.函数的上下文对象this。(上述)
2.封装实参的arguments,它是一个类数组对象,可以通过索引操作实参,也可以获取长度(实参的数量)。arguments.callee,此属性对应一个对象,该对象指向现在正在调用的函数。
如图:
效果与直接用参数是一样的,可以成功传递:
5.正则表达式
a.定义
用于定义一些字符串的规则,从而让计算机检测一个字符串是否匹配。
b.创建
1.构造函数创建:(灵活)
var reg=RegExp(“正则表达式”,“匹配模式”);
匹配模式——i:忽略大小写。 g:全局匹配模式。
2.字面量创建:(简单)
var reg=/正则表达式/匹配模式;
c.语法
- reg=/[ab]/ == reg=/a|b/ —— 检测a或b的存在。
- reg=/[A-z]/ —— 匹配任意字母。
- reg=/a[bc]d/ —— 匹配abd或acd。
- reg=/^[b]c/ —— '^[]'为除了的意思。
- reg=/a{3,}/ —— 用花括号’{}'设置量词,意为匹配连续出现3次以上的a串。
- reg=/a+/ —— 匹配至少一个a的串,相当于/a{1,}/。
- reg=/a*b/ —— 匹配含有a的串,相当于/a{0,}/。
- reg=/a?/ —— 匹配含有0或1个a的串,相当于/a{0,1}/。
- reg=/^a/ —— 匹配开头的a。
- reg=/a$/ —— 匹配结尾的a。
- /\w/ —— 匹配任意字母数字下划线。/\W/ —— 和\w相反。
- /\d/ —— 匹配数字。 /\D/ —— 和\d相反。
- /\s/ —— 匹配空格。 /\S/ —— 和\s相反。
- /\bchild\b/ ———— 添加单词边界以匹配独立的单词。/\B/ —— 和\b相反。
三、方法总结
另外因为所学方法太多,所以单拎出来总结一下:
1.数组对象:('×’为不改变原数组,'√’为会改变。)
方法 | 功能 |
---|---|
arr.length | 获取长度 |
arr.push() | 添加元素 |
arr.shift() | 删除数组的第一个元素 |
arr.pop() | 删除最后一个元素 |
arr.unshift() | 向开头添加元素,返回新的长度 |
arr.forEach(function(value,index,obj){console.log(value)}; | 遍历数组 |
arr.slice(0,2) | 数组切片× |
*arr.splice(0,2,“zzj”,…) | 删除并添加新元素√ |
arr.concat(arr1) | 连接多个数组,并返回新数组× |
arr.join(",") | 数组转字符串× |
arr.reverse() | 反转数组√ |
arr.sort(function(a,b){return a-b;} | 排序√ |
2.函数对象:
方法 | 功能 |
---|---|
fun.call() | 在调用时可以将一个对象指定为参数 |
fun.call() | 同上,但是其实参要封装到数组里传 |
3.Date对象:
方法 | 功能 |
---|---|
d.getMonth() | 获取当前对象是哪一月 |
d.getDate() | 获取当前对象是哪一天 |
d.getDay() | 获取当前对象是周几 |
4.Math对象:
方法 | 功能 |
---|---|
Math.ceil() | 向上取整 |
Math.floor() | 向下取整 |
Math.round() | 四舍五入 |
Math.random() | 生成0~1的随机数(无0和1) |
Math.round(Math.random()*(y-x)+x) | 生成x~y的随机整数 |
Math.max() | 多数取大 |
Math.min() | 多数取小 |
Math.pow(x,y) | x的y次幂 |