专辑篇:JS高级

前言:本篇主要讲各个api主要方法及使用----还有就是js中与众不同的语言特性.


JavaScript对象

JS中创建对象的方式

创建直接的实例:

var person=new Object();
person.firstname="John";
person.lastname="Doe";
person.age=50;
person.eyecolor="blue"; 
document.write(person.firstname + " is " + person.age + " years old.");
-----------------------------------
替代语法
person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"}
document.write(person.firstname + " is " + person.age + " years old.");

使用对象构造器

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<script>
function person(firstname,lastname,age,eyecolor){
    this.firstname=firstname;
    this.lastname=lastname;
    this.age=age;
    this.eyecolor=eyecolor;
}
myFather=new person("John","Doe",50,"blue");
document.write(myFather.firstname + " is " + myFather.age + " years old.");
</script>
</body>
</html>
备注:在javascript中this通常指向的是我们正在执行的函数本身,
或者是指向该函数所属的对象(运行时).

创建JavaScript对象实例:
一旦有了对象构造器,向已有对象添加新属性:

var myFather = new  person("John","Doe",50,"blue");
var myMother = new person("Sally","Rally",48,"green");

把属性添加到JavaScript对象

# 可以通过为对象赋值,向已有对象添加新属性:
# 假设personObj已存在,则可以为其添加新属性:firstname,lastname,age,eyecolor:
person.firstname="John";
person.lastname="Doe";
person.age=30;
person.eyecolor="blue";
x=person.firstname;

把方法添加到JavaScript对象

# 方法只不过是附加在对象上的函数.
# 在构造函数内部定义对象的方法
示例:
function person(firstname,lastname,age,eyecolor){
    this.firstname=firstname;
    this.lastname=lastname;
    this.age=age;
    this.eyecolor=eyecolor;
    this.changeName=changeName;
    function changeName(name){
        this.lastname=name;
    }
}
myMother=new person("Sally","Rally",48,"green");
myMother.changeName("Doe");

JavaScript类

JavaScript是面向对象的语言,但JavaScript不使用类.
在JavaScript中,不会创建类,也不会通过类来创建对象(这点和java/c++是完全不一样的).
JavaScript基于prototype,而不是基于类的.

JavaScript for in循环

JavaScriptfor...in语句循环遍历对象的属性

语法:
for(variable in object){
执行的代码...
}
注意:for...in循环中的代码块将针对每个属性执行一次

# 示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>  
<p>点击下面的按钮,循环遍历对象 "person" 的属性。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction(){
    var x;
    var txt="";
    var person={fname:"Bill",lname:"Gates",age:56}; 
    for (x in person){
        txt=txt + person[x];
    }
    document.getElementById("demo").innerHTML=txt;
}
</script>   
</body>
</html>

JS Number对象

JavaScript 数字

JavaScript只有一种数字类型.可以使用也可以不适用小数点来书写数字
表示方式:
var pi = 3.14;
var x = 34;
var y = 34e5;
var y = 34e-5;

# 所有javascript数字均为64位
JavaScript不是类型语言.与其他编程语言不同,JavaScript不定义,
不同类型的数字,比如整数,短,长,浮点等等.
在JavaScript中,数字不分为整数类型和浮点型类型,所有的数字都是由浮点
类型.
# 精度
整数最多为15位 (不使用小数点或指数计数法)
# 小数的运算不总是百分之百精确;
var x = 0.2+0.1;
# 8进制和16进制
如果前缀为0则JavaScript会把数值常量解释为8进制数,如果前缀为0和"x",则解
释为16进制数
#默认情况下,JavaScript数字为十进制显示.
但是你可以使用toString()方法输出16进制,8进制,2进制
var myNumber = 128;
myNumber.toString(16);   // 返回
80myNumber.toString(8);    // 返回 
200myNumber.toString(2);    // 返回 10000000

无穷大(Infinity)
var x = 2/0;正无穷 Infinity
var y = -2/0;负无穷-Infinity
NaN-非数字值

# NaN属性是代表非数字值的特殊值.该属性用于指示某个值不是数字.可以把Number对象设置为改制,来指示不是数字
可以使用isNaN()全局函数来判断一个值是否是NaN值
var x = 1000 / "Apple";
isNaN(x); // 返回 true
var y = 100 / "1000";
isNaN(y); // 返回 false
var x = 1000 / 0;
isNaN(x); // 返回 false

数字可以是数字或者对象

数字可以私有数据进行初始化,就像 x = 123;
JavaScript 数字对象初始化数据, var y = new Number(123);
# 实例
var x = 123;
var y = new Number(123);
typeof(x) // 返回 Number
typeof(y) // 返回 Object
# 实例
var x = 123;              
var y = new Number(123);
(x === y) // 为 false,因为 x 是一个数字,y 是一个对象

JavaScript字符串

  1. 字符串可以使用数组的形式取单个字符
  1. 字符串的长度属性length来计算字符串的长度
  2. indexOf()来查找子串在字符串中首次出现的位置,如果没有查到则返回-1,lastIndexOf()方法在字符串末尾开始查找子串出现的位置.
  3. 内容匹配:match()函数用来查找字符串中特定的字符,并且如果找到的话,则返回这个字符.如果没找到则返回null
  4. 替换内容,replace()方法在字符串中用某些字符替换另一些字符.
  5. 字符串大小写转换
    toUpperCase()/toLowerCase();
  6. 字符串转为数组:字符串使用split()函数转为数组:
txt="a,b,c,d,e"   // String
txt.split(",");   // 使用逗号分隔
txt.split(" ");   // 使用空格分隔
txt.split("|");   // 使用竖线分隔 
  1. 特殊字符,通过\转义

未完待续......

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

推荐阅读更多精彩内容