JS第一天

  • ECMAScript js的标准语法
  • DOM(html每一个标签对应一个对象)
  • html(控制内容)+css(控制样式)+js(控制行为)

html+js

  • 嵌入式

      <head>
        <script>
          //js代码
        </script>
      </head>
    
  • 导入(保证了html和js代码解耦)

       <head>
        <script src=""></script>
      </head>
    

注释

两种

  • //

  • /*

    */

标识符

由字母,数字,下划线,$,不能以数字开头,不能为关键字

数据类型(数据最小的单位)

弱类型语言

  • 基本数据类型
  • undefined;
    var a;//a的数据类型undefined
  • null;
    var b=null;//b的数据类型null
    var result=typeof b; //object
  • number;
    var a=10;
  • boolean;
    var a=true;
  • string;
    "" , '';

检测变量所属的数据类型
var sesult =typeof 变量名

提问框
var result = prompt("提问内容");
alert("提示信息");
console.log();

基本数据类型之间的转换

Undefiend

一般不考虑其他基本数据类型转换为undefined

Null类型

一般不考虑其他基本数据类型转换为null

Boolean类型

其他类型转换为Boolean:
虽然boolean类型的取值只有两个,但是ECMAScript中所有的类型的值都有
与这两个Boolean值等价的值

Boolean        true          false
String        非空字符串       ""
Number        任何非0非NaN      0和NaN
Undefined                 undefined    
Null                         null

例如:

   Boolean("");        //false
   Boolean(0);        //false
   Boolean(NaN);    //false
   Boolean(null)    //false
   Boolean(undefined)    //false
   Boolean("briup");    //true
   Boolean(1);        //true

Number

isNaN(para) 当参数para不是数值的时候返回true

数值转换

Number()
如果转换的值是null,undefined,number,boolean
    Number(true);    //1
    Number(false);    //0
    Number(10);    //10 如果是数字值,原样输出
    Number(null);        //0
    Number(undefined);    //NaN
如果是字符串:
    Number("123");  //如果仅包含数值,转换为对应的数值
    Number("234.1");//解析为对应的小数
    Number("+12.1");//首位为符号位,其余为为数值,转换为对应的数值
    NUmber("1+2.3");//NaN 符号位出现在其他位置,解析为NaN
    Number("0xa");  //如果仅包含十六进制格式,转为为对应的十进制的值
    Number("010");    //注意!不会当做八进制被解析,结果为10
    Number("");    //空字符串被转换为0
    Number("123ac");//包含其他字符: NaN
    Number(" 12");    //12
parseInt()
  • 如果转换的值是null,undefined,number,boolean

      parseInt(true);        //NaN
      parseInt(false);    //NaN
      parseInt(null);        //NaN
      parseInt(undefined);    //NaN
      parseInt(10);        //10 如果是整数值,原样输出
      parseInt(10.3);        //10 如果是小数,舍去小数点一级后面的内容
    
  • 如果是字符串:

      parseInt("123");  //123;如果仅包含数值,转换为对应的数值
      parseInt("234.1");//234;小数点后面的数值省略
      parseInt("+12.1");//12; 首位为符号位,其余为为数值,转换为整数,结果为
      parseInt("0xa");  //10; 如果仅包含十六进制格式,转为为对应的十进制的值
      parseInt("010");  //10; 注意!不会当做八进制被解析,结果为10
      parseInt("");      //NaN;空字符串被转换为NaN
      parseInt("1+2.3");//1;    如果首位为数值,依次向后解析,找到连续的数值,直到
                  遇到第一个非数值的,将之前获取的数值转换为Number返回
      parseInt("123ac");//123;   
    
parseFloat()
    与parseInt()类似,
    但是会将小数转换为对应的小数 

String

toString() 转化为字符串

包装器类 number -> Number
       var num = 10;
       num.toString();  "10"
       num.toString(2); "1010"
       num.toString(8); "12"
       num.toString(16);"a"

注意:
       null ,undefined 没有toString() 方法
       null.toString()        //报错 TypeError: null has no properties
   undefined.toString();    //报错 TypeError: undefined has no properties

String() 用来将任意数据类型转换为字符串

       String(null)        "null" 
       String(undefined);     "undefined"

复杂数据类型 Object

ECMAScript中的对象其实就是一组数据和功能的集合。

创建Object实例:

new Object() => {}; 创建一个空对象

new Object();

    var person = new Object();
    person.name = "briup";
    person.age = 22;

使用对象字面量表示法

     不同的属性之间用','分割,属性名和属性值之间用':'分割
    var person = {
        name : "briup",
        age : 22
    };

访问对象属性

点表示法,右侧必须是以属性名称命名的简单标识符

person.name

中括号表示法,中括号中必须是一个计算结果为字符串的表达式

可以通过变量访问属性

    var a = "name";
    person[a];    //既person["name"]
    person["first name"]

如果属性名中包含语法错误的字符,或者属性名使用的是关键字或保留字,
可以使用中括号 person["first name"]

删除属性

delete只是断开了属性和宿主对象的联系,而不会操作属性中的属性,并且delete
只会删除自有属性,不能删除继承属性。在销毁对象时,为了防止内存泄露,遍历属
性中的属性,依次删除所有属性。

  • 语法:delete 属性访问表达式
  • 例子:delete stu.name //删除学生对象中的name属性

检测属性

in 检测某属性是否是某对象的自有属性或者是继承属性

    "toString" in student

hasOwnProperty()检测给定的属性是否是对象的自有属性,对于继承属性将返回false

    var o = {
        x:1
    }
    o.hasOwnProperty("x");    //true, x 为o的自有属性
    o.hasOwnProperty("y");    //false,o 中不存在属性y
    o.hasOwnProperty("toString");    //toString为继承属性
 propertyIsEnumerable() 检测给定的属性是否是该对象的自有属性,并且该属性是可枚举的
    通常由JS代码创建的属性都是可枚举的,但是可以使用特殊的方法改变可枚举性。
    student.propertyIsEnumerable("toString")    //false 不可枚举

Object属性及方法

Object 类型所具有的任何属性和方法也同样存在于其他对象中,任何对象继承于Object对象

Object中常用的方法:

  • hasOwnProperty(propertyName); 用于检查给定的属性名是否是对象的自有属性,
  • toString(); 返回对象的字符串表示
  • valueOf(); 返回对象的字符串,数值,布尔值的表示。
    -------
  • propertyIsEnumerable(propertyName); 用于检查给定的属性在当前对象实例中是否存在
  • constructor: 保存用户创建当前对象的函数
  • isPrototypeOf(object); 用于检查传入的对象是否是原型
  • toLocaleString(); 返回对象的字符串表示,该字符串与执行环境的地区对应

对象序列化

对象序列化是指将对象的状态转换为字符串,也可以反序列化,将字符串还原为对象
函数,RegExp,Error对象,undefined值不能序列化和反序列化。

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

推荐阅读更多精彩内容

  • 第5章 引用类型(返回首页) 本章内容 使用对象 创建并操作数组 理解基本的JavaScript类型 使用基本类型...
    大学一百阅读 3,204评论 0 4
  • 什么是 JavaScript 语言? JavaScript 是一种轻量级的脚本语言。所谓“脚本语言”(script...
    oWSQo阅读 1,785评论 0 1
  • 再次回到学校本就让我感到极度孤单恐惧,曾经熟悉的同学朋友都已经离开,所有的时刻都只有自己一个人去面对,面对这空荡荡...
    墨子涵阅读 408评论 3 2
  • 草长莺飞二月天,拂堤杨柳醉春烟。儿童散学归来早,忙趁东风放纸鸢。 阳春三月,正是放风筝的好时节。今天天气格...
    中学生马小兑作文集阅读 522评论 4 6
  • 弟弟最近的模仿能力与日俱增。 1.吃的模仿能力 姐姐在吃桂圆干,先咬开桂圆皮,再拿出桂圆肉来。 坐在游戏垫子上的弟...
    师爷是枚美男子阅读 417评论 0 0