初识JavaScript

一、数据类型:

原始类型: 引用类型
null object
undefined function
number
string
boolean

NAN也是数据类型,表示数据不应该存在。例如0/0的计算结果,就是NAN

typeof(xx)的返回值即为基本数据类型,而这些数据类型显示都是字符串类型

typeof("1")//返回string
typeof "1"//也可以直接加空格再接参数,效果与加括号一样返回的也是string

原生JS里,只有手动赋值给一个变量null,才会产生null
未赋值的变量都是undefined

表达式一种数据,数据内容为表达式的计算结果
赋值表达式也是数据

console.log(a = 1 +  9 + 9)//结果为19

对象:

var obj = {
 0:"number",
name:"daming",
'age':28,
sun:{
  name:"xiaoming",
  age:2
  }
}
console.log(obj[0]) //number

js会把数字属性,自动转化为字符串。

四、显式类型转换

--
Number(mix)
parseInt(string,radix)
parseFloat(string)
String(mix)
toString(radix)
Boolean()

1.Number(mix)把字符串转换成数字。

Number(-123) // -123
Number(2.22) // 2.22
Number(null) // 0
Number(undefined) // NAN
Number("a") // NAN
Number("123abc") // NAN

2.parseInt(string,radix)把参数转化成整数,并向下取整。

parseInt(1.1) // 1
parseInt(1.9) // 1
parseInt("-123.3") // -123
console.log(parseInt("0.1") === parseInt("-0.1")) // true

parseInt(string,radix)有两个参数,默认第二个参数为10进制。该函数的意思是:radix进制的string,输出其在10进制下的结果

console.log(parseInt(10,16) ) // 16 把10转化为16进制,结果就是16
//意思是,十六进制的10,在10进制下,结果为16。
console.log(parseInt("b",16)) // 11
//十六进制的b,在10进制下,结果为11
//当参数为:不填 、字符串空、null、undefined、"abc" 、"123abc"之类的无法转化为数字的内容时时,
//返回NAN

3.parseFloat(string)parseInt类似。只是把参数转化为float类型。好处是不会像OC一样有浮动。

parseFloat("0.11a") // 0.11
parseFloat(123) // 123
//支持负数

4. String()把参数转化成字符串。能把输入的任意内容转化成字符串。包括undefined null NAN
5.toString() 用法跟String()有些区别。
toString()参数在前,一般用于把对象转化成字符串:object.toString()
String(Object)参数在中
两者区别在于
1.toString()不能把null,undefined,NAN作为参数。而String()可以把上述3个直接转化成字符串。
2.不能直接111.toString()。但是可以

var number = 111 
number.toString()

toString()还可以像parseInt()进行进制转换。

var number1 = 10
var number2 = number1.toString(16)
console.log(number2)
// a

但是这里有一些细节要注意:
1:
object.toString(redix)十进制的object,输出其在redix进制下的结果。
parseInt(object,radix):radix进制的object,输出其在10进制下的结果。
2:
toString()对象方法。所以前不能直接跟数字,例如1.toString()就会报错。但是如上例一样,先把Number类型赋值给变量number1。就可以使用。同理boolean类型也会报错。

6.Boolean() 有实际意义的参数,结果都是true。包括函数,对象。undefined null NAN返回fasle

五、隐式类型转换

-- 隐式转换
isNAN() Number()
++/-- +/-(正负符号如-1) Number()
+(加号) 只要前后有字符串存在,就都拼接成字符串
- * / % Number()
&& !|| Boolean()
< > <= >= 如果比较左右有数字,就会把不是数字的一端转化为数字。Number()
== != 如果比较左右有数字,就会把不是数字的一端转化为数字。Number()
=== !== 不发生类型转换

isNAN(object) 内部会先把object进行Number(object)转换,在拿结果与NAN进行比较。如果是NAN,则返回true。

console.log(isNAN(null)) // false
console.log(isNAN(undefined)) // true
console.log(isNAN("123")) // fasle
console.log(isNAN("abc")) // true

1 > 2 > 3
会先进行1 > 2 再把结果 > 3;

console.log(undefined == null) //ture
console.log(NAN == NAN) //fasle
console.log(typeof(a)) //console一个未定义的变量,只有这种情况不会报错,结果为字符串"undefined".

六:立即执行函数(匿名函数):

(function() {}) ()
(function() {} ())

作用是避免全局污染,强行改变作用域。

正常的函数调用的方法为:

function fun() {
}
fun()

但是如果这样写,就会报错。

function fun() {
}()

因为 function 可以是语句或者表达式

//语句
function fun(){
};
//表达式
var fun = function (){
};

为了避免解析上的歧义,JS规定,如果function出现在行首,一律解析成语句。

因此JS看到行首是function关键字以后,认为这一段都是函数定义,不应该以原括号结尾,所以就报错了。

七:this

  • 在函数中使用this,它的指向完全取决于函数是如何被调用的

    调用方式 示例 函数中的this指向
    通过new调用 new method() 新对象
    直接调用 method() 全局对象
    通过对象调用 obj.method() 前面的对象
    call method.call(ctx) call的第一个参数
    apply method.apply(ctx) apply的第一个参数
  • call函数的理解

function func(e) {
  console.log(this)
};

var obj = {
  func2: function () { 
  }
}

func.call(obj)//{ func2: [Function: func2] }
//立即执行func()函数,但把func函数里的this指向obj.
  • 伪数组转数组:
var obj = {
  0: 'a',
  1: 'b',
  2: 'c',
  length:3
}
console.log(Array.prototype.slice.call(obj))//[ 'a', 'b', 'c' ]

要理解这个转换,需要先理解slice()的实际执行含义。

var arr = ['a', 'b', 'c']
console.log(arr.slice(1, 2))//[ 'b']
slice方法在上述语句中的的意思是:
对arr这个数组取其length为2的部分。从下标1开始读,每读到一个数据,就添加到数组中,最终返回这个数组。

理解了slice()方法,就能完全理解上述转换的原理了:
call()方法,把slice()里的this指向obj(因为obj是对象,没有slice()方法)。然后slice会取objlength,得到的结果是3。然后从下标0开始读,一直读到长度3结束。把读到的结果,添加到数组中,并返回。

假如把上述obj改为:

var obj = {
  0: 'a',
  2: 'c',
  3: 'c',
  length:3
}
console.log(Array.prototype.slice.call(obj))//['a', empty, 'c']

八:构造函数

function Obj (name,age) {
this.name = name,
this.age = age,
this.sayHi = function() {
console.log(this.name+this.age)
  }
}

var obj = new Obj('lili',18)
obj.sayHi();

因此可以看出,其实每个对象都是一个函数。每个函数也都是一个对象。

九:原型链

原型:

每个函数都会自动附带一个属性prototype,这个属性的值是一个普通对象,称之为原型对象。
每个实例都拥有一个特殊的属性__proto__,称之为隐式原型,它指向构造函数的原型
当访问实例成员时,先找自身,如果不存在,会自动从隐式原型中寻找
这样一来,我们可以把那些公共成员,放到函数的原型中,即可被所有实例共享
hasOwnProperty判断一个属性是在自身而不是在原型上。
in判断属性是不是在该对象自身或者原型上。

var obj = {a:1}
Object.prototype.b = 2;
console.log('a' in obj)//true
console.log('b' in obj)//true

原型链:

  1. instanceof关键字【常用】

    object instanceof constructor
    // 判断object的原型链中,是否存在constructor的原型
    

创建空原型的对象。

  1. 利用Object.create()

    Object.create(target);
    // 返回一个新对象,新对象以target作为隐式原型
    
  2. 利用Object.setPrototypeOf()

    Object.setPrototypeOf(obj, prototype);
    // 设置obj的隐式原型为prototype
    

十:继承

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

推荐阅读更多精彩内容