21000+行原生J S的学习之路(第一篇)

学习JS已经有一年多了(小白),看了很多书,也写了不少代码,但是总感觉功力还是不够(哈哈),前段时间偶然接触到原生JS代码,边对此产生了兴趣,学习原生JS对于我们深入了解js有很好的帮助比如函数的参数类型、返回值类型等。下来先介绍一下原生JS的语法结构,来帮助大家更好的学习和阅读原生JS:

declare function eval(x: string): any;

上面这个就是我们常见的eval函数在原生JS中的写法,括号中X为函数的参数,‘:’后面为参数的类型,最外层‘:’后面为调用函数返回值的类型。any表示可以任意类型(float,int,double,Boolean等),具体的由调用时计算得到。

下来开始正式学习:

1.

declare const NaN: number;declare const Infinity: number;

由上面的代码可以看出NaN,infinity均为number类型,并且它俩均被const限定符修饰,即是不可修改的。

typeof NaN    // "number"

typeof Infinity  // "number"

2.

declare function parseInt(s: string, radix?: number): number;

parseInt()我们会经常用到,它里面需要传两个参数(一个必需的string类型的S,另一个radix为可选的)它的返回值类型为number,

radix表示要解析的数字的基数。该值通常为2,8,10,16(该值介于 2 ~ 36 之间).即根据需要将传入的S转换成以radi为基数的number。

parseInt("04");         //返回 4  
parseInt("31",10);       //返回 31 (3*10+1)
parseInt("11",2);        //返回 3  (1*2+1)  
parseInt("27",8);        //返回 23  (8*2+7)
parseInt("2f",16);       //返回 47  (16*2+f)  
parseInt("010");        //返回 10

括号中的算法可以帮助我们快速计算出表达式的值。

3.

declare function parseFloat(string: string): number;

parseFloat()和parseInt()类似,但是他只接受一个string类型参数,同样其返回值的类型为number。

document.write(parseFloat("10"))            //10
document.write(parseFloat("10.00"))         //10
document.write(parseFloat("10.33"))         //10.33
document.write(parseFloat("34 45 66"))      //34
document.write(parseFloat(" 60 "))          //60
document.write(parseFloat("40 years"))      //40
document.write(parseFloat("He was 40"))     //NaN

4.

declare function isNaN(number: number): boolean;

isNaN()方法通常备用来判断传入的参数是不是一个数字,上面的写法中表示传入的参数为number类型,我觉得这里写的不对,如果传入的参数都是number类型了还用判断是不是number吗。

isNaN(123)           //false
isNaN(-1.23)         //false
isNaN(5-2)           //false
isNaN(0)             //false
isNaN("Hello")       //true
isNaN("2005/12/12")  //true
isNaN({})            //true

注意:true表示传入的参数不是number,false相反。

5.

declare function isFinite(number: number): boolean;

isFinite()方法用来判断传入的number是有穷的还是无穷的,若为有穷,返回true,反之返回false。

document.write(isFinite(123)+ "<br />")             //true
document.write(isFinite(-1.23)+ "<br />")           //true
document.write(isFinite(5-2)+ "<br />")             //true
document.write(isFinite(0)+ "<br />")               //true
document.write(isFinite("Hello")+ "<br />")         //false
document.write(isFinite("2005/12/12")+ "<br />")    //false

6.

declare function decodeURI(encodedURI: string): string;

declare function encodeURI(uri: string): string;

encodeURI() 函数可把字符串作为 URI 进行编码。返回值为URIstring 的副本,其中的某些字符将被十六进制的转义序列进行替换。

decodeURI() 函数可对 encodeURI() 函数编码过的 URI 进行解码。返回值为URIstring 的副本,其中的十六进制转义序列将被它们表示的字符替换。

var test1="http://www.w3school.com.cn/My first/"

document.write(encodeURI(test1)+ "<br />")
// http://www.w3school.com.cn/My%20first/
document.write(decodeURI(test1))
// http://www.w3school.com.cn/My first/

7.

declare function encodeURIComponent(uriComponent: string): string;

declare function decodeURIComponent(encodedURIComponent: string): string;

encodeURIComponent() 函数可把字符串作为 URI 组件进行编码。

document.write(encodeURIComponent("http://www.w3school.com.cn"))
document.write("<br />")
document.write(encodeURIComponent("http://www.w3school.com.cn/p 1/"))
document.write("<br />")
document.write(encodeURIComponent(",/?:@&=+$#"))
/*  输出
    http%3A%2F%2Fwww.w3school.com.cn
    http%3A%2F%2Fwww.w3school.com.cn%2Fp%201%2F
    %2C%2F%3F%3A%40%26%3D%2B%24%23
*/

decodeURIComponent() 函数可对 encodeURIComponent() 函数编码的 URI 进行解码。

var test1="http://www.w3school.com.cn/My first/"

document.write(encodeURIComponent(test1)+ "<br />")
document.write(decodeURIComponent(test1))
/*  输出
    http%3A%2F%2Fwww.w3school.com.cn%2FMy%20first%2F
    http://www.w3school.com.cn/My first/
*/

关于javascript中url编码与解码点击此链接可进行详细的了解

8.

interface PropertyDescriptor {
    configurable?: boolean;
    enumerable?: boolean;
    value?: any;
    writable?: boolean;
    get? (): any;
    set? (v: any): void;
}

上述为一个原型接口函数PropertyDescriptor(),其包含四个内置属性configurable,enumberable,value,writeable对应的值类型为Boolean,Boolean,any,Boolean。

还包含两个方法:get,set。其中set方法是没有返回值的。

用法大致如下:

var o = {name:"HD"};
Object.defineProperty(o,"age",{
    configurable:true,
    enumerable:true,
    set:function(age){       return this.age = age;
    },
    get:function(){        
    }
});
var oDesc_name = Object.getOwnPropertyDescriptor(o,"name");

9.

interface PropertyDescriptorMap {
     [s: string]: PropertyDescriptor;
}

类似于PropertyDescriptor()

欲知后事如何,且听下回分解!

时间: 2024-08-09 06:21:59

21000+行原生J S的学习之路(第一篇)的相关文章

21000+行原生J S的学习之路(第二篇)

10.  object interface Object {     /** The initial value of Object.prototype.constructor is the standard built-in Object constructor. */     constructor: Function;     /** Returns a string representation of an object. */     toString(): string;     /

21000+行原生J S的学习之路(第三篇)

11. {     ()()()()()()[]()()()()T(T)TT(T[])TT (T)TT(T)TT(T)T()()()()[]} 今天我们来看下对象的constructor属性. 11.1 new()对于我们来说是一个很常用的方法比如我们实例化一个Object的时候,它里面的参数可以是任何类型的,既然是实例化一个对象那么它返回的肯定还会是一个对象. 11.2 readonly property当然就不用多说了,Object property肯定是只读的.来看看getProperty

ISO开发学习之路--第一篇--图像显示器制作(1)

项目主要工作,能够通过按钮按进行翻上一张和下一张对相片就行查看功能.这项目有点简单,但是是学习的必经过程.对学习的整理和参考. 主要目的: 1)熟悉3大控件的使用方法和规则 2)熟悉3大控件的编程方法 3)熟悉ISO开发技巧 下面是今天学习内容的源码,这部分源码实现的有点罗嗦,后期会改成,后来会用plist的方式和应用数组的方式,简化实现图片显示的方法. #import "ViewController.h" @interface ViewController () @property

IOS开发学习之路--第一篇--准备和说明

经过1个多月的对Objective-C的学习和了解,对其也有一定的认识,但是仅仅是了解,还需要今后的不断熟练和摸索才能掌握. 从现在写这个文章起,正式进入了学习IOS开发之路.之前看了很多人发表自己的论坛或者博客,觉得自己也该有这个东西,不仅可以充实学习内容,也是积累知识的过程.同时也可以总结学习过程中的各种方法. 长风破浪会有时,直挂云帆济沧海!每天进步一点点,生活乐趣大点点! 学习IOS开发,主要的学习资料: 1)OC基础,李明杰IOS开发基础视频(C和OC)经典 2)IOS开发技术,黑马2

kafka 学习之路 第一篇

kafka官网:http://kafka.apache.org/ 下载地址:http://mirrors.hust.edu.cn/apache/kafka/0.10.2.0/kafka_2.12-0.10.2.0.tgz 未完待续

Eclipse插件开发 学习笔记 PDF 第一篇到第四篇 免分下载 开发基础 核心技术 高级进阶 综合实例

<<Eclipse插件开发 学习笔记>>,本书由浅入深.有重点.有针对性地介绍了Eclipse插件开发技术,全书分为4篇共24章.第一篇介绍Eclipse平台界面开发的基础知识.包含SWT控件的使用.界面布局.事件处理等内容:第二篇是插件开发核心技术,主要介绍插件开发的核心知识要点,包含行为(Action).视图(ViewPart).编辑器(Editor).透视图(Perspective)等10章的内容.第三篇主要讲述插件开发的高级内容,包含开发高级内容.富client平台技术(R

python3自动化运维学习之路第一天

概要:python简介.第一个python程序.变量.字符编码.用户交互程序.if...else.while.for 一.python简介 首先,我们普及一下编程语言的基础知识.用任何编程语言来开发程序,都是为了让计算机干活,比如下载一个MP3,编写一个文档等等,而计算机干活的CPU只认识机器指令,所以,尽管不同的编程语言差异极大,最后都得"翻译"成CPU可以执行的机器指令.而不同的编程语言,干同一个活,编写的代码量,差距也很大. 比如,完成同一个任务,C语言要写1000行代码,Jav

学习Java 的第一篇文章

第一章   Java基础 1.学习方法: 01.找一本好书 初始阶段不适合,可以放到第二个阶段,看到知识点时,要进行验证 02.查看帮助文档和搜索引擎的使用 借助网络上的Blog文章 03.不要急功近利 不要抱着速成的想法,否则必然走弯路     学习编程不是一蹴而就的事情     付出的成本高,才能有一个高薪的收入 04.不要浮躁 不要什么都学,只学有用的 浮躁的程度和技术水平成反比的     走自己的路,让别人去浮躁去吧! 每天问问自己,我是不是开始浮躁了,不能人云亦云. 05.学习语言基础

前端学习之路——scss篇

学习资料: sass语法 http://www.w3cplus.com/sassguide/syntax.html Sass http://sass.bootcss.com/docs/sass-reference/  http://www.ruanyifeng.com/blog/2012/06/sass.html 一.什么是SASS SASS是一种CSS的开发工具,提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护. 二.安装和使用 Sass依赖于ruby环境,所以