JS源码(条件的判定,循环,数组,函数,对象)整理摘录
---
title: JS学习笔记-从条件判断语句到对象创建
date: 2016-04-28 21:31:13
tags: [javascript,front-end]
---
JS学习笔记——整理自《JavaScript高级程序设计》
1)条件的判定
在if,swtich条件判断语句,do-while,while,for三种循环判断语句中会用到条件的判断,其目的是为了判定某种条件的达成与否来控制语句的执行。
e.g.
if(condition) do{} while(condition) for(initialization;condition;post-loop-expression){} switch(expression){
case condition:
break;
default:
break;
}
以上例子中的condition就是条件的判断的语句。condition语句可以是任意表达式,ES会自动将表达式的结果转为布尔值。
另外,switch的expression如写成true,可以在之后的condition中写入表达式,以此可以模仿if的判断行为。
s.e.g.
switch(true){
case (i>):
i++;
}
2)循环
一.do-while语句是一种后测试循环语句,循环体内的代码至少会循环一次。
e.g.
var I =;
do {
i+;
}while(i<);
二.While语句是前测试循环语句,循环体的代码可能一次也不会执行。
e.g.
var I = ;
while (i <) {
i+;
}
三.for语句也是前测试循环语句,但是它具备while所没有的初始化变量和定义循环后要执行代码的能力。for 和 while 的循环功能是一样的,while 做不到for也做不到。
e.g.
var count=;
for(var i=;i<count;i++){
alert(i);
i++;
}
四.for-in 语句用来循环枚举对象的属性。循环会持续到对象的所有属性都被枚举一遍为止。单次循环时会将枚举到的一个属性名赋予in前的变量。
e.g.
for (var proName in window) {
document.write(propName);
}
3)数组
Array是数据的有序列表,数组的每一项可以保存任意类型的数据,而且数组的长度可以随时变化。
创建数组的方法:
1.使用Array 构造函数:
var colors = new Array();
声明了一个拥有20长度的colors数组。
var colors = new Array(“red”,”blue”,”green”);
声明了一个拥有3长度的colors数组,并把三个颜色值写入了数组的前三项。
2.使用数组字面量:
var colors = [“red”,”blue”,”green”];
声明了一个拥有3长度的colors数组,并把三个颜色值写入了数组的前三项。
各种属性值与方法:
.length属性可写入。
instance of Array 可判断对象是否是数组。ES5之后的版本可用.is Array()判断对象是否是数组。
.toString(),toLocalString() 会返回逗号分隔的字符串,其中toLocalString()对每一项数值调用的是toLocalString()方法。
.valueOf() 返回的是数组。
.join()方法可以通过传递的指定的字符来分隔原数组,返回的是分隔后的字符串。
栈方法:
后进先出。
.push()接受任意数量的参数,逐个添加到数组末尾,返回的是修改后数组的长度。
.pop()不接受参数,每次调用pop()都会移除数组的最后一项并作为pop()的值返回。
队列方法:
先进先出。
.shift()移除数组的第一项,并作为值返回,与pop()对应。
.unshift()在数组开头添加任意项,并返回修改后的数组长度,与push()相对应。
重排序方法:
.sort():
能将数组内的各项按顺序重新排序,默认为按照ASCII码进行升序排序。
能接受一个比较函数作为参数,比较函数内的两个参数进行比较:
e.g.
function compare(value1,value2){
if (value1 < value2){
return 1;
}else if (value1 > value2){
Return -1;
}else{
Return 0;
}
}
用这个比较函数返回给.sort()的话,数组会按照数值的从小到大进行排序,将上述的return值互调的话,数组会按照数值的从大到小排序。
.reverse():将数组所有项的顺序取反并返回取反后的数组。
操作方法
.concat():将接受的参数连接在原数组的后面。如果接受的参数是一个数组,将会把数组中的每一项提取后单独加入到原数组中。
.slice():接受一到两个参数,创建一个新的数组,包含从第一个参数为止到第二个参数为止的所有数据项,不包含第二个参数位置的项。如果没有第二个参数,则执行到数组最末尾。
.splice():拼接方法,第一个参数表示起始位置,第二个参数表示要删除的数组项数,之后的参数表示要从第一个参数的位置开始要插入的数据。通过第一第二个参数的变化,可以模拟push,pop,shift,unshift的四种方法达到同样的效果,本身的意义在于在数组中插入数据。
位置方法
.indexOf():查找指定的项,第一个参数表示要查找的数据项,第二个参数表示要开始查询的位置。lastIndexOf()则是从数组的后面开始。
##4)函数
声明式:
function functionName(){ };
表达式:
var functionName = function(){ }
声明式会提升该段代码的优先级,解析器会在所有代码之前读取函数声明。
表达式不会提升优先级,函数名只是指向函数的指针,将函数名赋予一个变量只是赋予了引用类型。
JS中函数没有重载的概念,后定义的函数会覆盖之前的函数。
arguments指代了函数的所有参数,是一个数组,arguments.callee方法指向arguments的调用函数。
.caller方法指向了调用当前函数的函数。
.apply() 和.call()两个方法的作用是让函数在特定的作用域中调用函数。
this指代了当前执行环境的主体。
##5)对象
ES中的对象就是一组数据和功能的集合,创建Object类型的实例并给它添加属性和方法,就可以自定义对象。
除Object外,Array,Date,RegExp,Function,Boolean,Number,String,Global,Math等这些也都是对象。
创建Object的两钟基础方法:
e.g.
var person = new Object();
Person.name = “Peter”;
这种方法是使用new操作符加Object构造函数。
对象字面量:
e.g.
Var person = {
Name : ”Peter”,
Age:29;
};
使用对象字面量法定义对象,不会调用Object的构造函数,更常使用。
为了解决使用同一个接口创建很多对象,产生大量重复代码的问题,出现了后面几种创建对象的方法:
·工厂模式
function createPerson(name,age,job){
var o =new Object();
o.name = name;
o.age = age;
o.job = job;
o.sayName = function(){
alert(this.name);
};
return o;
}
解决了创建多个相似对象的问题,但没有解决对象识别的问题。
·构造函数模式
function createPerson(name,age,job){
this.name = name;
this.age = age;
this.job = job;
this.sayName = function(){
alert(this.name);
};
}
构造函数模式可以将它的实例识别为一种特定的类型,解决了对象识别的问题。但是每个方法都要在每个实例上重新创建一边。
·原型模式
通过调用每个函数都有的prototype原型属性来创建共享属性和方法的实例。
function Person(){
}
Person.prototype.name ="Peter";
Person.prototype.age = 20;
Person.prototype.sayName =function(){
alert(this.name);
} var person1 = new Person();
原型模式下,实例中创建的属性会屏蔽原型中的属性,而对原型对象所做的任何修改都能立即从实例上反应出来。
·组合使用构造函数和原型模式
function Person(name,age){
this.name =name;
this.age = age;
}
Person.prototype = {
constructor:Person,
sayName : function(){
alert(this.name);
}
} var person1 = new Person("Peter",20);
实例属性在构造函数中定义,实例共享的属性和方法在原型中定义,这种方法可能最适合。
JS源码(条件的判定,循环,数组,函数,对象)整理摘录的更多相关文章
- Vue.js 源码分析(一) 代码结构
关于Vue vue是一个兴起的前端js库,是一个精简的MVVM.MVVM模式是由经典的软件架构MVC衍生来的,当View(视图层)变化时,会自动更新到ViewModel(视图模型),反之亦然,View ...
- 从template到DOM(Vue.js源码角度看内部运行机制)
写在前面 这篇文章算是对最近写的一系列Vue.js源码的文章(https://github.com/answershuto/learnVue)的总结吧,在阅读源码的过程中也确实受益匪浅,希望自己的这些 ...
- Underscore.js 源码学习笔记(上)
版本 Underscore.js 1.9.1 一共 1693 行.注释我就删了,太长了… 整体是一个 (function() {...}()); 这样的东西,我们应该知道这是一个 IIFE(立即执行 ...
- underscore.js源码解析(四)
没看过前几篇的可以猛戳这里: underscore.js源码解析(一) underscore.js源码解析(二) underscore.js源码解析(三) underscore.js源码GitHub地 ...
- underscore.js源码解析(三)
最近工作比较忙,做不到每周两篇了,周末赶着写吧,上篇我针对一些方法进行了分析,今天继续. 没看过前两篇的可以猛戳这里: underscore.js源码解析(一) underscore.js源码解析(二 ...
- MVVM大比拼之avalon.js源码精析
简介 avalon是国内 司徒正美 写的MVVM框架,相比同类框架它的特点是: 使用 observe 模式,性能高. 将原始对象用object.defineProperty重写,不需要用户像用knoc ...
- 深入理解unslider.js源码
最近用到了一个挺好用的幻灯片插件,叫做unslider.js,就想看看怎么实现幻灯片功能,就看看源码,顺便自己也学习学习.看完之后收获很多,这里和大家分享一下. unslider.js 源码和使用教程 ...
- 从jquery源码中看类型判断和数组的一些操作
在深入看jquery源码中,大家会发现源码写的相当巧妙.那我今天也通过几个源码中用到的技巧来抛砖引玉,希望大家能共同研究源码之精华,不要囫囵吞枣. 1.将类数组转化成数组 我想大家首先想到的方法是fo ...
- vue.js源码精析
MVVM大比拼之vue.js源码精析 VUE 源码分析 简介 Vue 是 MVVM 框架中的新贵,如果我没记错的话作者应该毕业不久,现在在google.vue 如作者自己所说,在api设计上受到了很多 ...
- Underscore.js 源码学习笔记(下)
上接 Underscore.js 源码学习笔记(上) === 756 行开始 函数部分. var executeBound = function(sourceFunc, boundFunc, cont ...
随机推荐
- oracle连接错误
公司用的数据库,动不动会出现一些问题.但是都是大家比较常见的.所以,贴出来给大家看看1,oracle启动数据库时报错:SQL> startup;ORA-01078: failure in pro ...
- scala目录
1. 使用Scala(构建这样一个应用,它会取回一份列表,其中包括用户持有的股票的代码以及股份,并告知他们在当前日期为止的这些投资的总价.这包含了几件事:获取用户输入.读文件.解析数据.写文件.从We ...
- Ubuntu下安装FTP服务及使用(以VSFTPD为例)
(一)安装与配置 (1) 安装vsftpd $sudo apt-get install vsftpd 这里会提示无法创建/home/ftp目录,手动创建一个 $sudo mkdir /ho ...
- 使用boost的deadline_timer实现一个异步定时器
概述 最近在工作上需要用到定时器,然后看到boost里面的deadline_timer可以实现一个定时器,所以就直接将其封装成了ATimer类,方便使用,ATimer有以下优点: 可以支持纳秒.毫秒. ...
- C#基础--struct(结构体)
结构体和类有点类似 我们定义一个类的时候 是class 类名 定义结构体的时候是 struct 结构体名 结构体的写法 struct Point { // public int ...
- WinDBG快速定位异常位置
在WinDBG中通过搜索内存中保存的CONTEXT结构来定位发生的异常信息,再通过WinDBG命令.cxr显示对应的调用堆栈信息. .foreach ( place { s-[1]d 0 L?FF ...
- 【Shell脚本学习3】什么时候使用Shell
因为Shell似乎是各UNIX系统之间通用的功能,并且经过了POSIX的标准化.因此,Shell脚本只要“用心写”一次,即可应用到很多系统上.因此,之所以要使用Shell脚本是基于: 简单性:Shel ...
- 重构12-Break Dependencies(打破依赖)
有些单元测试需要恰当的测试“缝隙”(test seam)来模拟/隔离一些不想被测试的部分.如果你正想在代码中引入这种单元测试,那么今天介绍的重构就十分有用.在这个例子中,我们的客户端代码使用一个静态类 ...
- <c:forEach> 详解
<c:forEach>标签用于通用数据循环,它有以下属性 属 性 描 述 是否必须 缺省值 items 进行循环的项目 否 无 begin 开始条件 否 0 end 结束条件 否 集合中的 ...
- web前端开发(5)
CSS的一些问题: 一般情况下,尽量使用class选择器 解决点击超链接后hover 样式不出现多次问题:a:visited a:hover 的顺序是问题所在,记住 love hate L(lin ...